/*
 * GWP responsive system
 * Desktop remains the source layout. Breakpoints progressively recompose content
 * for tablet and mobile instead of simply shrinking desktop UI.
 */

/* Universal anti-overflow safeguards. */
html,body{max-width:100%;overflow-x:hidden}
.container,.hero-grid,.product-grid,.split-grid,.origin-grid,.deployment-grid,.modularity-grid,.collaborate-grid,.founder-card,.status-callout{min-width:0}
h1,h2,h3,p,li,strong,span,a,label,blockquote{overflow-wrap:anywhere}
.gwp-media,.gwp-media-placeholder,iframe,video,svg{max-width:100%}

@media(max-width:1100px){
  .primary-nav{gap:18px}
  .pillars-grid,.principles-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pillar:nth-child(3),.principle:nth-child(3){border-right:0}
  .pillar:nth-child(n+4),.principle:nth-child(n+4){border-top:1px solid rgba(255,255,255,.16)}
  .timeline{grid-template-columns:repeat(9,150px)}
  .hero-visual{min-height:420px}
  .gwp-media-placeholder{min-height:360px}
  .architecture-main{grid-template-columns:1fr auto 1fr auto 1fr}
  .architecture-main span:last-child{grid-column:1/-1}
  .architecture-main b:nth-of-type(3){display:none}
}

@media(max-width:900px){
  .nav-toggle{display:block;min-width:44px;min-height:44px;margin-inline-end:-8px}
  .primary-nav{position:absolute;top:82px;left:0;right:0;background:#fff;border-bottom:1px solid var(--gwp-line);box-shadow:0 18px 40px rgba(9,42,70,.08);padding:18px var(--gwp-gutter) 24px;display:none;flex-direction:column;align-items:stretch;gap:0;max-height:calc(100svh - 82px);overflow-y:auto;overscroll-behavior:contain}
  .primary-nav.is-open{display:flex}
  .primary-nav a{display:flex;align-items:center;min-height:48px;padding:10px 0;font-size:.95rem}
  .primary-nav .button{margin-top:10px;width:100%}
  body.nav-open{overflow:hidden}

  .hero-grid,.product-grid,.derating-grid,.deployment-grid,.modularity-grid,.collaborate-grid{grid-template-columns:minmax(0,1fr)}
  .hero-copy{max-width:760px}
  .hero-visual{min-height:0}
  .hero:before{right:-25vw;width:78vw;height:78vw;opacity:.7}

  .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .metric:nth-child(2){border-right:0}
  .metric:nth-child(n+3){border-top:1px solid var(--gwp-line)}

  .split-grid,.origin-grid,.founder-card{grid-template-columns:minmax(0,1fr);gap:35px}
  .status-row{grid-template-columns:minmax(0,1fr) auto}
  .status-row p{grid-column:1/-1;margin-inline-start:21px}

  .architecture-main{display:flex;flex-wrap:wrap}
  .architecture-main span{flex:1 1 180px;min-width:0}
  .architecture-main b{display:none}

  .roadmap{grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr) 30px minmax(0,1fr)}
  .footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .footer-grid>div:first-child{grid-column:1/-1}
}

@media(max-width:640px){
  :root{--gwp-gutter:20px;--gwp-section:68px;--gwp-radius:10px}

  .header-inner{height:72px}
  .primary-nav{top:72px;max-height:calc(100svh - 72px);padding-top:14px;padding-bottom:max(24px,env(safe-area-inset-bottom))}
  .brand{gap:9px}
  .brand-mark{font-size:1.12rem}
  .brand-sub{display:none}

  h1{font-size:clamp(2.75rem,14vw,4.25rem);max-width:10ch;margin-bottom:22px}
  h2{font-size:clamp(2rem,9.2vw,3rem);line-height:1.05;margin-bottom:20px}
  h3{line-height:1.2}
  .eyebrow{font-size:.68rem;line-height:1.45;letter-spacing:.13em;margin-bottom:14px}
  .section-copy,.hero-support{font-size:.98rem}

  .hero{padding-top:112px;padding-bottom:58px}
  .hero-grid{gap:40px}
  .hero-lede{font-size:clamp(1.18rem,5.6vw,1.48rem);max-width:29ch}
  .hero-support{line-height:1.65}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:28px}
  .hero-actions .button{width:100%;min-height:50px}
  .status-badge{display:flex;width:fit-content;max-width:100%;border-radius:10px;line-height:1.35;white-space:normal;padding:10px 12px}
  .hero-visual{width:100%}
  .gwp-media--hero,.gwp-media--cutaway{max-height:420px;width:100%;object-fit:contain}

  .metrics-grid{grid-template-columns:1fr;margin-top:44px}
  .metric,.metric+.metric{padding:18px 0;border-right:0;border-left:0;border-top:1px solid var(--gwp-line)}
  .metric:first-child{border-top:0}

  .failure-list,.facts-grid,.compare-grid,.form-row{grid-template-columns:1fr}
  .failure-list span{font-size:.88rem}
  .compare-grid>div+div{border-left:0;border-top:1px solid var(--gwp-line)}
  .compare-grid>div{padding:26px 22px}

  .continuity-diagram{grid-template-columns:1fr;gap:9px;margin-top:42px}
  .continuity-diagram>div{min-height:auto;padding:19px}
  .continuity-diagram i{height:24px;width:1px;margin:auto}
  .continuity-diagram i:after{right:-3px;top:auto;bottom:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:6px solid var(--gwp-water);border-bottom:0}

  .architecture-card{margin-top:42px;padding:20px}
  .architecture-main{display:grid;grid-template-columns:1fr;gap:8px}
  .architecture-main span,.architecture-input span{padding:14px 12px}
  .architecture-input{flex-direction:column;align-items:stretch;gap:8px;margin-top:20px;padding-top:20px}
  .architecture-input b{text-align:center;transform:rotate(90deg);height:18px;line-height:18px}

  .product-grid,.derating-grid,.deployment-grid,.modularity-grid,.collaborate-grid{gap:42px}
  .product-copy p{font-size:1rem}
  .product-panel .gwp-media-placeholder,.gwp-media-placeholder{min-height:240px;padding:26px 18px}
  .gwp-media-placeholder strong{font-size:1.15rem}

  .tab-list{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;scroll-snap-type:x proximity}
  .tab-list button{flex:0 0 auto;min-height:46px;padding:11px 13px;scroll-snap-align:start;white-space:nowrap}
  .tab-copy{padding-top:16px}

  /* Process becomes a vertical technical flow on phones: no sideways hunting. */
  .process-flow{display:grid;grid-template-columns:1fr;gap:0;margin-top:36px;overflow:visible;padding:0}
  .process-node{min-width:0;width:100%;padding:14px 16px}
  .process-flow>i{height:24px;justify-content:center;padding:0;transform:rotate(90deg)}
  .concentrate-flow{display:grid;grid-template-columns:1fr;gap:8px}
  .concentrate-flow>strong{margin-bottom:3px}

  .pillars-grid,.principles-grid{grid-template-columns:1fr;margin-top:38px}
  .pillar,.pillar+.pillar,.principle,.principle+.principle{padding:23px 0;border-right:0;border-left:0;border-top:1px solid rgba(255,255,255,.16)}
  .pillar:first-child,.principle:first-child{border-top:1px solid rgba(255,255,255,.16)}
  .pillar>span{margin-bottom:20px}
  .principle p{margin-top:20px;font-size:1.05rem}

  .status-matrix{margin-top:35px}
  .status-row{grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:17px 0;align-items:start}
  .status-row>div{gap:10px;min-width:0}
  .status-row>b{font-size:.65rem;white-space:nowrap}
  .status-row p{grid-column:1/-1;margin:2px 0 0 19px;font-size:.86rem;line-height:1.5}
  .facts-block{margin-top:52px}
  .facts-grid{gap:0}
  .fact{padding:16px}

  .derating-bars>div{grid-template-columns:68px minmax(0,1fr) 82px;gap:8px;font-size:.75rem}
  .derating-bars strong{white-space:normal;line-height:1.25}
  .modelled-badge{line-height:1.35}

  /* Pilot timeline is vertical on phone; desktop/tablet keep the engineering timeline. */
  .timeline{display:grid;grid-template-columns:1fr;gap:0;overflow:visible;margin-top:40px;padding-left:0}
  .timeline li{min-height:0;padding:0 0 26px 30px;border-top:0;border-left:1px solid var(--gwp-line)}
  .timeline li span{top:2px;left:-6px}
  .timeline li:not(:last-child):after{top:7px;bottom:0;left:-1px;right:auto;width:1px;height:auto;background:var(--gwp-water)}
  .timeline li:last-child{padding-bottom:0;border-left-color:transparent}
  .timeline strong{max-width:none;font-size:.88rem}

  .origin-copy blockquote{margin:22px 0;padding:20px 0 20px 20px;font-size:clamp(1.45rem,7vw,2rem)}
  .origin-tagline{margin-top:26px}

  .deployment-chain{grid-template-columns:1fr;margin:24px 0}
  .deployment-chain span{padding:11px 13px}
  .module-cloud{margin-top:24px;gap:7px}
  .module-cloud span{font-size:.76rem;padding:7px 9px}

  .roadmap{grid-template-columns:1fr;gap:9px;margin-top:42px}
  .roadmap>i{height:18px;width:1px;margin:auto}
  .roadmap article{padding:20px}

  .founder-card{padding:25px 22px;gap:26px}
  .founder-card h2{font-size:clamp(2rem,10vw,2.8rem)}

  .status-callout{grid-template-columns:1fr;padding:30px 22px;gap:20px}
  .status-callout:after{width:240px;height:240px;right:-110px;top:-100px}
  .stage-chip{justify-self:start;max-width:100%;white-space:normal;line-height:1.35}
  .status-warning{padding-top:18px}

  .form-card{padding:22px 18px}
  .form-card label{margin-bottom:14px}
  .form-card input,.form-card select,.form-card textarea{min-height:48px;font-size:16px;padding:11px 12px}
  .form-card textarea{min-height:150px}
  .form-card .button{width:100%;min-height:50px}
  .form-card .consent input{min-height:0}

  .site-footer{padding:56px 0 26px}
  .footer-grid{grid-template-columns:1fr;gap:32px}
  .footer-grid>div:first-child{grid-column:auto}
  .footer-nav,.footer-legal{gap:5px}
  .footer-nav a,.footer-legal a{display:flex;align-items:center;min-height:42px}
  .footer-disclaimer{margin-top:36px;padding-top:20px;flex-direction:column;gap:12px}

  .content-shell{padding:118px 0 70px}
  .prose h1{font-size:clamp(2.35rem,12vw,3.4rem)}
  .prose p,.prose li{font-size:1rem}
}

@media(max-width:420px){
  :root{--gwp-gutter:17px;--gwp-section:60px}

  h1{font-size:clamp(2.55rem,13.5vw,3.55rem)}
  h2{font-size:clamp(1.85rem,9.5vw,2.55rem)}
  .hero{padding-top:104px}
  .hero-grid{gap:34px}
  .hero-lede{font-size:1.16rem}

  .gwp-media-placeholder{min-height:210px}
  .gwp-media-placeholder__eyebrow{font-size:.6rem;letter-spacing:.12em}

  .status-row{grid-template-columns:1fr}
  .status-row>b{justify-self:start;margin-left:19px}
  .status-row p{margin-left:19px}

  /* Give derating labels their own readable rows on very narrow screens. */
  .derating-bars>div{grid-template-columns:minmax(0,1fr) auto;gap:7px 10px;margin-bottom:22px}
  .derating-bars i{grid-column:1/-1;grid-row:2}
  .derating-bars strong{text-align:right}

  .tab-list button{padding-inline:11px;font-size:.86rem}
  .roadmap strong{font-size:1.35rem}
  .compare-grid>div{padding:23px 18px}
}

@media(max-width:340px){
  :root{--gwp-gutter:15px}
  .brand-mark{font-size:1.04rem}
  .nav-toggle{margin-inline-end:-6px}
  h1{font-size:2.5rem}
  h2{font-size:1.82rem}
  .hero-actions .button,.form-card .button{padding-inline:14px}
  .architecture-card,.founder-card,.status-callout,.form-card{padding-left:17px;padding-right:17px}
}

/* WordPress admin bar offsets fixed navigation correctly. */
.admin-bar .site-header{top:32px}
@media(max-width:782px){.admin-bar .site-header{top:46px}}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .reveal{opacity:1;transform:none}
}

/* RTL readiness, including mobile overrides. */
[dir="rtl"] body{text-align:right}
[dir="rtl"] .check-list li{padding-left:0;padding-right:22px}
[dir="rtl"] .check-list li:before{left:auto;right:0}
[dir="rtl"] .origin-copy blockquote{border-left:0;border-right:2px solid var(--gwp-gold);padding-left:0;padding-right:28px}
[dir="rtl"] .metric{border-right:0;border-left:1px solid var(--gwp-line)}
[dir="rtl"] .metric:last-child{border-left:0}
@media(max-width:640px){
  [dir="rtl"] .metric,[dir="rtl"] .metric+.metric{border-left:0;border-right:0}
  [dir="rtl"] .status-row p{margin-left:0;margin-right:19px}
  [dir="rtl"] .timeline li{padding:0 30px 26px 0;border-left:0;border-right:1px solid var(--gwp-line)}
  [dir="rtl"] .timeline li span{left:auto;right:-6px}
  [dir="rtl"] .timeline li:not(:last-child):after{left:auto;right:-1px}
  [dir="rtl"] .origin-copy blockquote{padding-right:20px}
}
@media(max-width:420px){
  [dir="rtl"] .status-row>b,[dir="rtl"] .status-row p{margin-left:0;margin-right:19px}
}