/*
Theme Name: LRG Technology
Theme URI: https://lrgtechnology.com
Description: Custom theme for LRG Technology — machined-steel + Laser Blue design system, imported from the Claude Design "LRG Technology Style Guide" (v2.0). Built by BlueCrane / SiteForge. Phase-1 testbed.
Author: BlueCrane
Version: 0.1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 8.0
Text Domain: lrg
*/

/* ============================================================
   LRG DESIGN SYSTEM — tokens, components, animations
   (consolidated from the Claude Design project + responsive layer)
   ============================================================ */

:root{
  --lrg-white:#ffffff; --lrg-cloud:#f5f5f7; --lrg-silver:#d2d2d7;
  --lrg-steel:#86868b; --lrg-graphite:#424245; --lrg-onyx:#1d1d1f;
  --lrg-laser:#0AB1FF; --lrg-laser-hover:#0098E6; --lrg-laser-tint:rgba(10,177,255,0.22);
  --lrg-live:#1d8a4e; --lrg-live-dot:#1fc26b;
  --lrg-line:#ededf0; --lrg-line2:#e2e2e6; --lrg-line3:#e7e7ea;
  --lrg-mute:#6e6e73; --lrg-mute2:#a0a0a5;
  --lrg-max:1280px;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; background:#fff; }
body.lrg{ font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; color:var(--lrg-onyx); -webkit-font-smoothing:antialiased; }
.lrg img{ max-width:100%; height:auto; }
.lrg ::selection{ background:var(--lrg-laser-tint); }
.lrg a{ text-decoration:none; color:inherit; }

/* mono labels */
.mono{ font-family:'Space Mono',ui-monospace,Menlo,monospace; }

/* metal numerals + quote marks */
.metalnum{
  background-image:linear-gradient(155deg,#2a2a2d 0%,#6e6e73 38%,#b8b8bd 52%,#54545a 70%,#1d1d1f 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
}

/* nav links */
.navlink{ color:var(--lrg-graphite); transition:color .18s ease; }
.navlink:hover,.navlink.active{ color:var(--lrg-onyx); }

/* buttons */
.btn-solid{ display:inline-block; background:var(--lrg-laser); color:#fff; border:1px solid var(--lrg-laser);
  transition:background .18s ease, box-shadow .2s ease; box-shadow:0 2px 16px rgba(10,177,255,0.45); }
.btn-solid:hover{ background:var(--lrg-laser-hover); box-shadow:0 2px 24px rgba(10,177,255,0.62); }
.btn-line{ display:inline-block; background:#fff; color:var(--lrg-onyx); border:1px solid var(--lrg-silver);
  transition:background .18s ease, border-color .18s ease; }
.btn-line:hover{ background:var(--lrg-cloud); border-color:#c2c2c7; }

/* bento */
.bento{ transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.bento:hover{ transform:translateY(-3px); box-shadow:0 18px 40px rgba(20,20,30,0.10); border-color:var(--lrg-silver); }
.bento:hover .bento-arrow{ transform:translateX(5px); opacity:1; }
.bento-arrow{ transition:transform .2s ease, opacity .2s ease; opacity:.35; display:inline-block; }

/* pricing */
.price-col{ transition:background .2s ease; }
.price-col:hover{ background:#f0f0f2; }

/* form fields (contact) */
.field{ width:100%; font-family:inherit; font-size:15px; color:var(--lrg-onyx); background:#fbfbfc;
  border:1px solid var(--lrg-line2); padding:13px 14px; transition:border-color .18s ease, background .18s ease; }
.field::placeholder{ color:var(--lrg-mute2); }
.field:focus{ outline:none; border-color:var(--lrg-laser); background:#fff; }
.chip{ transition:background .18s ease, border-color .18s ease, color .18s ease; cursor:pointer; }
.chip:hover{ border-color:var(--lrg-laser); color:var(--lrg-onyx); }

/* animations */
@keyframes lrg-pulse{ 0%,100%{opacity:1;} 50%{opacity:.35;} }
.pulse-dot{ animation:lrg-pulse 1.8s ease-in-out infinite; display:inline-block; border-radius:50%; }
@keyframes lrg-ticker{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.ticker-track{ display:flex; width:max-content; animation:lrg-ticker 26s linear infinite; }
@keyframes lrg-glare-sweep{
  0%{transform:translateX(-150%) skewX(-13deg);opacity:0;} 10%{opacity:.40;} 40%{opacity:.20;}
  58%{transform:translateX(220%) skewX(-13deg);opacity:0;} 100%{transform:translateX(220%) skewX(-13deg);opacity:0;} }
.glare-sweep{ animation:lrg-glare-sweep 11s cubic-bezier(.33,0,.2,1) infinite; will-change:transform,opacity; }
@media (prefers-reduced-motion: reduce){
  .pulse-dot,.ticker-track,.glare-sweep{ animation:none !important; }
}

/* ===== shared layout shells ===== */
.lrg .wrap{ max-width:var(--lrg-max); margin:0 auto; padding-left:28px; padding-right:28px; }
.lrg .accentbar{ height:2px; background:linear-gradient(90deg,#0AB1FF 0%,#0AB1FF 18%,#e2e2e6 18%,#e2e2e6 100%); }
.lrg .blueprint{ position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.55) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,0.022) 1px,transparent 1px); background-size:100% 34px,34px 100%; opacity:.6; }

/* nav */
.lrg .site-header{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,0.86); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid var(--lrg-line); }
.lrg .nav-inner{ max-width:var(--lrg-max); margin:0 auto; height:68px; padding:0 28px; display:flex; align-items:center; justify-content:space-between; }
.lrg .nav-links{ display:flex; align-items:stretch; gap:26px; height:68px; font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.lrg .nav-item{ position:relative; display:flex; align-items:center; }
.lrg .nav-item > .navlink{ display:flex; align-items:center; gap:5px; }
.lrg .dd-caret{ font-size:9px; color:#a0a0a5; transition:transform .18s ease, color .18s ease; }
.lrg .nav-item.has-dd:hover .dd-caret,
.lrg .nav-item.has-dd:focus-within .dd-caret{ transform:rotate(180deg); color:#0AB1FF; }
/* dropdown panel */
.lrg .dropdown{ position:absolute; top:100%; left:0; padding-top:2px; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .16s ease, transform .16s ease, visibility .16s; z-index:60; }
.lrg .nav-item.has-dd:hover .dropdown,
.lrg .nav-item.has-dd:focus-within .dropdown{ opacity:1; visibility:visible; transform:translateY(0); }
.lrg .dd-inner{ background:#fff; border:1px solid #e2e2e6; box-shadow:0 20px 44px rgba(20,20,30,0.12); padding:16px; min-width:240px; display:flex; flex-direction:column; gap:2px; }
.lrg .dd-inner.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:2px 22px; min-width:440px; }
.lrg .dd-link{ display:block; font-size:14px; font-weight:500; letter-spacing:0; text-transform:none; color:#424245; padding:8px 10px; transition:background .15s ease, color .15s ease; }
.lrg .dd-link:hover{ background:#f5f5f7; color:#0AB1FF; }
.lrg .dd-all{ font-weight:600; color:#0AB1FF; text-transform:uppercase; font-size:11px; letter-spacing:.06em; padding-bottom:10px; margin-bottom:4px; border-bottom:1px solid #ededf0; }
.lrg .dd-inner.two-col .dd-all{ grid-column:1 / -1; }
.lrg .dd-head{ font-family:'Space Mono',monospace; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#86868b; padding:4px 10px 10px; }
/* services mega */
.lrg .dropdown.mega{ left:0; }
.lrg .mega-inner{ display:grid; grid-template-columns:repeat(4, minmax(190px,1fr)); gap:8px 20px; min-width:820px; padding:22px; }
.lrg .dd-col{ display:flex; flex-direction:column; gap:1px; }
.lrg .dd-cta{ border-left:1px solid #ededf0; padding-left:20px; }
.lrg .nav-toggle{ display:none; background:none; border:0; cursor:pointer; font-size:22px; color:var(--lrg-onyx); }
.lrg .logo-mark{ font-weight:700; font-size:21px; letter-spacing:-0.02em; color:var(--lrg-onyx); display:inline-flex; align-items:center; gap:7px; }
.lrg .logo-mark .dot{ width:9px; height:9px; background:var(--lrg-laser); display:inline-block; }
.lrg .logo-mark .thin{ font-weight:300; color:var(--lrg-graphite); }

/* responsive grids (named so media queries can restyle inline-free) */
.lrg .hero-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center; }
.lrg .bento-grid{ display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr; gap:16px; }
.lrg .stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--lrg-line2); border:1px solid var(--lrg-line2); }
.lrg .split-grid{ display:grid; grid-template-columns:1fr 1fr; }
.lrg .three-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.lrg .cards3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--lrg-line2); border:1px solid var(--lrg-line2); }
.lrg .cards3-gap{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.lrg .pricing-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--lrg-line); border:1px solid var(--lrg-line); }
.lrg .footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; }
.lrg .contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
.lrg .two-grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:start; }

/* tablet */
@media (max-width:1024px){
  .lrg h1{ font-size:clamp(40px,8vw,64px) !important; }
  .lrg .hero-grid{ grid-template-columns:1fr; gap:40px; }
  .lrg .split-grid{ grid-template-columns:1fr; }
  .lrg .two-grid{ grid-template-columns:1fr; gap:36px; }
  .lrg .contact-grid{ grid-template-columns:1fr; gap:40px; }
  .lrg .bento-grid > a[style*="span 2"]{ grid-column:auto !important; }
}
/* mobile */
@media (max-width:760px){
  .lrg .wrap, .lrg .nav-inner{ padding-left:18px; padding-right:18px; }
  .lrg .nav-links{ display:none; }
  .lrg .nav-toggle{ display:block; }
  .lrg .nav-links.open{ display:flex; position:absolute; top:68px; left:0; right:0; height:auto; max-height:calc(100vh - 68px); overflow-y:auto; flex-direction:column; gap:0; background:#fff; border-bottom:1px solid var(--lrg-line); padding:8px 18px 24px; }
  .lrg .nav-links.open .nav-item{ display:block; }
  .lrg .nav-links.open > .nav-item > .navlink{ padding:14px 0; border-bottom:1px solid var(--lrg-line); }
  .lrg .nav-links.open .dd-caret{ display:none; }
  .lrg .nav-links.open .dropdown{ position:static; opacity:1; visibility:visible; transform:none; padding-top:0; }
  .lrg .nav-links.open .dd-inner, .lrg .nav-links.open .mega-inner{ display:block; box-shadow:none; border:none; min-width:0; padding:6px 0 10px 12px; }
  .lrg .nav-links.open .dd-cta{ border-left:none; padding-left:0; }
  .lrg .nav-links.open .dd-head{ padding:10px 0 4px; }
  .lrg .nav-links.open .dd-link{ padding:9px 0; }
  .lrg .nav-links.open .dd-all{ border-bottom:none; }
  .lrg .bento-grid,.lrg .three-grid,.lrg .cards3,.lrg .cards3-gap,.lrg .pricing-grid,.lrg .footer-grid{ grid-template-columns:1fr !important; }
  .lrg .stats-grid{ grid-template-columns:repeat(2,1fr) !important; }
  .lrg section[style]{ padding-left:18px !important; padding-right:18px !important; }
  .lrg h1{ font-size:clamp(34px,11vw,52px) !important; }
  .lrg h2{ font-size:clamp(30px,7vw,44px) !important; }
}