/* LGI Kitchen Innovations: about page styles. Distinct but consistent;
   shared tokens and chrome come from base.css. */

body{font-family:'Manrope',sans-serif;background:var(--grad-light);background-attachment:fixed;color:var(--ink);font-size:var(--body);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}

.reveal{opacity:0;transform:translateY(40px);transition:opacity 700ms var(--ease-out-quart),transform 700ms var(--ease-out-quart)}
.reveal.in{opacity:1;transform:translateY(0)}

/* HERO */
.page-hero{position:relative;overflow:hidden;background:var(--grad-steel);padding:clamp(8.5rem,16vw,11rem) 0 clamp(3.5rem,7vw,5.5rem)}
.page-hero .mesh-a{position:absolute;top:-28%;left:-6%;width:52vw;height:52vw;border-radius:50%;background:radial-gradient(circle,rgba(38,86,150,0.34) 0%,transparent 62%);filter:blur(6px)}
.page-hero .mesh-b{position:absolute;bottom:-42%;right:-12%;width:62vw;height:62vw;border-radius:50%;background:radial-gradient(circle,rgba(26,43,69,0.5) 0%,transparent 60%)}
.page-hero .inner{position:relative;z-index:2;max-width:60rem}
.page-hero h1{font-family:'Fraunces',serif;font-weight:300;font-size:var(--display-md);line-height:1.06;color:var(--paper);letter-spacing:-0.015em;margin:1.4rem 0 1.5rem}
.page-hero h1 .word{display:inline-block;opacity:0;transform:translateY(34px)}
.is-loaded .page-hero h1 .word{opacity:1;transform:translateY(0);transition:opacity 800ms var(--ease-out-expo),transform 800ms var(--ease-out-expo)}
.page-hero p.lead{font-size:var(--body-lg);max-width:42rem;color:rgba(247,246,242,0.74);opacity:0;transform:translateY(18px)}
.is-loaded .page-hero p.lead{opacity:1;transform:translateY(0);transition:opacity var(--dur-base) .7s,transform var(--dur-base) .7s}

/* STORY */
.about-body{padding:clamp(4rem,9vw,7rem) 0}
.about-body .wrap{max-width:64rem}
.about-sec{display:grid;grid-template-columns:auto 1fr;gap:clamp(1.4rem,4vw,3rem);padding:clamp(2rem,4vw,3.2rem) 0;border-top:1px solid rgba(26,43,69,0.12)}
.about-sec:first-child{border-top:none;padding-top:0}
.anum{font-family:'JetBrains Mono',monospace;font-size:0.85rem;letter-spacing:0.16em;color:var(--heat);padding-top:0.55rem}
.acopy h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(1.6rem,3.2vw,2.35rem);line-height:1.1;letter-spacing:-0.01em;margin-bottom:0.9rem}
.acopy p{color:var(--graphite);font-size:var(--body-lg);max-width:46rem}
@media(max-width:680px){.about-sec{grid-template-columns:1fr;gap:0.5rem}}

/* CTA */
.cta{padding:clamp(4rem,8vw,6rem) 0;text-align:center;color:var(--paper);background:var(--grad-steel)}
.cta .eyebrow{margin-bottom:0.4rem}
.cta h2{font-family:'Fraunces',serif;font-weight:300;font-size:var(--display-md);line-height:1.06;margin:1rem 0 1.1rem;letter-spacing:-0.015em}
.cta p{color:rgba(247,246,242,0.72);max-width:38rem;margin:0 auto 1.8rem}

/* ---------- FOOTER ---------- */
/* Canonical footer styling, matched to index.css. about.css was missing this block
   entirely, which left the shared footer partial unstyled (broken/misaligned). */
footer{background:radial-gradient(80% 130% at 0% 0%,rgba(26,43,69,0.22),transparent 60%),var(--grad-ink);color:var(--paper);padding:clamp(3.5rem,7vw,5rem) 0 2.2rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.6rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,0.08)}
@media(max-width:768px){.foot-grid{grid-template-columns:1fr;gap:2.2rem}}
.foot-brand .mark{font-family:'Fraunces',serif;font-weight:600;font-size:1.6rem;color:var(--paper)}
.foot-brand p{color:var(--silver);margin-top:0.7rem;font-size:var(--small);font-style:italic;font-family:'Fraunces',serif}
.foot-col h4{font-family:'JetBrains Mono',monospace;font-size:var(--micro);letter-spacing:0.2em;text-transform:uppercase;color:var(--heat);margin-bottom:1rem}
.foot-col a,.foot-col .ci{display:block;color:rgba(247,246,242,0.7);font-size:var(--small);padding:0.3rem 0;transition:color var(--dur-fast)}
.foot-col a:hover{color:var(--paper)}
.foot-col .ph{color:var(--silver);font-style:italic}
.copyright{padding-top:1.8rem;font-family:'JetBrains Mono',monospace;font-size:var(--micro);color:var(--silver);letter-spacing:0.06em}