/* LGI Kitchen Innovations: quote page styles. Distinct look for this page;
   shared tokens and chrome come from base.css. */

body{font-family:'Manrope',sans-serif;background:linear-gradient(168deg,#FBFAF8 0%,#EFF3F5 100%);background-attachment:fixed;color:var(--ink);font-size:var(--body);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}

.mono{font-family:'JetBrains Mono',monospace}

/* NAV */

.nav-link.active{color:var(--heat)}

/* PAGE HERO (focused, animated gradient) */
.page-hero{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;background:var(--grad-steel);overflow:hidden;padding:11rem 0 4.5rem}
.orb{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
.orb.a{width:42vw;height:42vw;background:radial-gradient(circle,rgba(232,85,43,0.16),transparent 60%);top:-10%;left:5%;animation:drift1 24s ease-in-out infinite}
.orb.b{width:48vw;height:48vw;background:radial-gradient(circle,rgba(26,43,69,0.6),transparent 62%);bottom:-20%;right:0%;animation:drift2 28s ease-in-out infinite}
@keyframes drift1{0%,100%{transform:translate(0,0)}50%{transform:translate(8%,6%)}}
@keyframes drift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-7%,-5%)}}
.hero-inner{position:relative;z-index:2;max-width:900px}
.hero-inner .eyebrow{justify-content:center;margin-bottom:1.5rem}
.hero-inner h1{font-family:'Fraunces',serif;font-weight:300;color:var(--paper);font-size:clamp(2.6rem,6vw,4.8rem);line-height:1.04;letter-spacing:-0.02em;margin-bottom:1.4rem}
.hero-inner h1 .word{display:inline-block;opacity:0;transform:translateY(40px);transition:opacity 900ms var(--ease-out-expo),transform 900ms var(--ease-out-expo)}
.is-loaded .hero-inner h1 .word{opacity:1;transform:none}
.hero-inner .lead{color:rgba(247,246,242,0.78);font-size:var(--body-lg);max-width:38rem;margin:0 auto;opacity:0;transform:translateY(20px);transition:opacity var(--dur-base),transform var(--dur-base) var(--ease-out-quart);transition-delay:700ms}
.is-loaded .hero-inner .lead{opacity:1;transform:none}

/* FORM SECTION */
.formsec{padding:clamp(2.5rem,5vw,4rem) 0 clamp(4.5rem,9vw,7rem)}
.formcard{position:relative;max-width:760px;margin:-5rem auto 0;background:var(--grad-card);border:1px solid rgba(138,144,153,0.22);border-radius:14px;padding:clamp(1.8rem,4vw,3rem);box-shadow:0 30px 70px rgba(15,20,25,0.12);transition:opacity var(--dur-base)}
.form-head{margin-bottom:2rem}
.form-head .eyebrow{margin-bottom:0.7rem}
.form-head h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-0.01em}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem 1.6rem}
.field{position:relative;margin-top:0.6rem}
.field.full{grid-column:1 / -1}
.field input,.field textarea,.field select{width:100%;background:transparent;border:none;border-bottom:1px solid rgba(138,144,153,0.5);padding:1.35rem 0 0.55rem;font-family:'Manrope',sans-serif;font-size:var(--body);color:var(--ink);transition:border-color var(--dur-base)}
.field textarea{resize:vertical;min-height:90px}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-bottom:2px solid var(--heat)}
.field label{position:absolute;left:0;top:1.25rem;font-family:'JetBrains Mono',monospace;font-size:0.74rem;letter-spacing:0.04em;text-transform:uppercase;color:var(--silver);pointer-events:none;transition:transform var(--dur-base) var(--ease-out-quart),font-size var(--dur-base),color var(--dur-base)}
.field input:focus + label,.field input:not(:placeholder-shown) + label,.field textarea:focus + label,.field textarea:not(:placeholder-shown) + label,.field.float label{transform:translateY(-1.25rem);font-size:0.6rem;color:var(--heat)}
.field .opt{color:var(--silver);font-size:0.62rem}
.field .err-msg{display:none;font-family:'JetBrains Mono',monospace;font-size:0.62rem;color:var(--err);margin-top:0.35rem}
.field.error input,.field.error textarea,.field.error select{border-bottom:2px solid var(--err)}
.field.error .err-msg{display:block}
.field.error label{color:var(--err)}
.field select{appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg width='11' height='7' viewBox='0 0 11 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%238A9099' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 0.2rem center}
.note{font-family:'JetBrains Mono',monospace;font-size:0.6rem;color:var(--silver);margin-top:0.4rem;letter-spacing:0.04em}

/* equipment checkboxes */
.fieldset{grid-column:1 / -1;margin-top:1.4rem}
.fieldset legend{font-family:'JetBrains Mono',monospace;font-size:0.72rem;letter-spacing:0.04em;text-transform:uppercase;color:var(--silver);margin-bottom:0.9rem}
.fieldset.error legend{color:var(--err)}
.cbx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0.7rem}
.cbx{position:relative;display:flex;align-items:center;gap:0.7rem;cursor:pointer;padding:0.7rem 0.9rem;border:1px solid rgba(138,144,153,0.3);border-radius:8px;transition:border-color var(--dur-fast),background var(--dur-fast)}
.cbx:hover{border-color:var(--ink)}
.cbx input{position:absolute;opacity:0;width:0;height:0}
.cbx .box{width:22px;height:22px;flex:none;border:2px solid var(--silver);border-radius:5px;display:flex;align-items:center;justify-content:center;transition:background var(--dur-base),border-color var(--dur-base)}
.cbx .box svg{width:13px;height:13px}
.cbx .box svg path{stroke:#fff;stroke-width:2.4;fill:none;stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset 300ms var(--ease-out-quart)}
.cbx input:checked + .box{background:var(--heat);border-color:var(--heat)}
.cbx input:checked + .box svg path{stroke-dashoffset:0}
.cbx input:checked ~ .cl{color:var(--ink)}
.cbx input:focus-visible + .box{outline:2px solid var(--heat);outline-offset:2px}
.cbx .cl{font-size:var(--small);color:var(--graphite)}
.err-msg.group{display:none;font-family:'JetBrains Mono',monospace;font-size:0.62rem;color:var(--err);margin-top:0.6rem}
.fieldset.error .err-msg.group{display:block}

/* submit + confirmation */
.submit-row{grid-column:1 / -1;margin-top:1.8rem;display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.submit-btn{position:relative;min-width:200px;height:54px;border:none;border-radius:6px;background:linear-gradient(120deg,var(--heat),var(--ember));color:#fff;font-family:'Manrope',sans-serif;font-weight:600;font-size:var(--small);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:0.6rem;overflow:hidden;transition:transform var(--dur-base) var(--ease-out-quart),box-shadow var(--dur-base),min-width var(--dur-base)}
.submit-btn:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(232,85,43,0.4)}
.submit-btn svg{transition:transform var(--dur-base)}.submit-btn:hover svg{transform:translateX(5px)}
.submit-btn.loading{min-width:54px;pointer-events:none}
.submit-btn.loading .lbl{display:none}
.submit-btn .spin{display:none;width:20px;height:20px;border:2px solid rgba(255,255,255,0.35);border-top-color:#fff;border-radius:50%;animation:spin 0.7s linear infinite}
.submit-btn.loading .spin{display:block}
.submit-btn.done{min-width:160px;pointer-events:none;background:linear-gradient(120deg,#2E8B57,#246b43)}
.submit-btn.done .lbl,.submit-btn.done .spin{display:none}
.submit-btn .done-lbl{display:none;align-items:center;gap:0.5rem}
.submit-btn.done .done-lbl{display:inline-flex}
@keyframes spin{to{transform:rotate(360deg)}}
.submit-note{font-family:'JetBrains Mono',monospace;font-size:0.62rem;color:var(--silver);letter-spacing:0.03em}
.confirm{grid-column:1 / -1;margin-top:1.6rem;opacity:0;transform:translateY(16px);max-height:0;overflow:hidden;transition:opacity var(--dur-slow) var(--ease-out-quart),transform var(--dur-slow) var(--ease-out-quart),max-height var(--dur-slow)}
.confirm.show{opacity:1;transform:none;max-height:300px}
.confirm-inner{display:flex;gap:1rem;align-items:flex-start;background:rgba(46,139,87,0.08);border:1px solid rgba(46,139,87,0.3);border-radius:10px;padding:1.3rem 1.5rem}
.confirm .ck{width:30px;height:30px;flex:none;border-radius:50%;background:#2E8B57;display:flex;align-items:center;justify-content:center}
.confirm .ck svg{width:15px;height:15px;stroke:#fff;stroke-width:2.5;fill:none}
.confirm h4{font-family:'Fraunces',serif;font-weight:400;font-size:1.2rem;margin-bottom:0.3rem}
.confirm p{font-size:var(--small);color:var(--graphite)}
.confirm p .ph{font-family:'JetBrains Mono',monospace;color:var(--silver);font-size:0.78rem}
.formcard.sent{opacity:0.55}
.formcard.sent .grid2 > *:not(.confirm):not(.submit-row){pointer-events:none}

/* TIMELINE (dark) */
.timeline-sec{background:var(--grad-ink);padding:clamp(4.5rem,9vw,7rem) 0;color:var(--paper)}
.timeline-sec .sec-head{text-align:center;max-width:680px;margin:0 auto 3.5rem}
.timeline-sec .eyebrow{justify-content:center;margin-bottom:1rem;color:var(--heat)}
.timeline-sec h2{font-family:'Fraunces',serif;font-weight:300;font-size:var(--display-md);letter-spacing:-0.02em;color:var(--paper)}
.steps{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,4vw,3rem);max-width:1000px;margin:0 auto}
.steps .conn{position:absolute;top:42px;left:12%;right:12%;height:2px;background:rgba(247,246,242,0.16);overflow:hidden}
.steps .conn::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--heat),var(--ember));transform:scaleX(0);transform-origin:left;transition:transform 900ms var(--ease-out-quart)}
.steps.in .conn::after{transform:scaleX(1)}
.step{text-align:center;position:relative;z-index:2}
.step .sn{font-family:'Fraunces',serif;font-weight:300;font-size:3.4rem;color:var(--heat);line-height:1;display:inline-block;transform:scale(0);transition:transform 600ms var(--ease-spring)}
.steps.in .step .sn{transform:scale(1)}
.step h3{font-family:'Fraunces',serif;font-weight:400;font-size:1.3rem;color:var(--paper);margin:0.8rem 0 0.5rem;opacity:0;transform:translateY(10px);transition:opacity var(--dur-slow),transform var(--dur-slow) var(--ease-out-quart)}
.step p{font-size:var(--small);color:rgba(247,246,242,0.74);max-width:18rem;margin:0 auto;opacity:0;transform:translateY(10px);transition:opacity var(--dur-slow),transform var(--dur-slow) var(--ease-out-quart)}
.steps.in .step h3,.steps.in .step p{opacity:1;transform:none}

/* TRUST */
.trust{padding:clamp(3.5rem,7vw,5.5rem) 0;text-align:center}
.trust-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:0.9rem;font-family:'JetBrains Mono',monospace;font-size:0.8rem;letter-spacing:0.08em;color:var(--graphite)}
.trust-row .dot{width:5px;height:5px;border-radius:50%;background:var(--heat);flex:none}
.trust-close{font-family:'Fraunces',serif;font-style:italic;font-size:1.15rem;color:var(--ink);margin-top:1.4rem}

/* FOOTER */
footer{background:var(--grad-ink);color:rgba(247,246,242,0.7);padding:4.5rem 0 2.2rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem;padding-bottom:2.6rem;border-bottom:1px solid rgba(247,246,242,0.1)}
.foot-brand .mark{font-family:'Fraunces',serif;font-weight:600;font-size:1.35rem;color:var(--paper)}
.foot-brand p{margin-top:0.6rem;font-size:var(--small);max-width:18rem}
.foot-col h4{font-family:'JetBrains Mono',monospace;font-size:0.66rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--silver);margin-bottom:1rem}
.foot-col a,.foot-col .ci{display:block;font-size:var(--small);color:rgba(247,246,242,0.72);padding:0.32rem 0;transition:color var(--dur-fast)}
.foot-col a:hover{color:var(--heat)}
.foot-col .ci.ph{color:var(--silver);font-family:'JetBrains Mono',monospace;font-size:0.72rem}
.copyright{padding-top:1.8rem;font-family:'JetBrains Mono',monospace;font-size:0.68rem;letter-spacing:0.06em;color:var(--silver)}

@media(max-width:760px){
  .grid2{grid-template-columns:1fr}
  .cbx-grid{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr;gap:2.5rem}
  .steps .conn{display:none}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .nav-links{display:none}.nav-toggle{display:block}
  .foot-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.2s !important}
  .hero-inner h1 .word,.hero-inner .lead{opacity:1 !important;transform:none !important}
  .orb{animation:none}
  .submit-btn .spin{animation:none}
  .steps .conn::after{transform:scaleX(1)}
  .step .sn{transform:scale(1)}
  .step h3,.step p{opacity:1;transform:none}
}
