/* =====================================================================
   SITAARA — COMPLETION PAGES STYLESHEET
   Shared styling for the account, shopping, checkout, order, search,
   information and legal pages. It deliberately reuses the approved
   design system (styles.css tokens, contact.css form language,
   collection.css card grid) and adds NO new design language.
   ===================================================================== */

/* ---- page shell (mirrors contact / collections page scaffolding) ---- */
.p-body{padding-top:var(--headerH);background:var(--paper);min-height:100dvh}
.p-page{max-width:1180px;margin:0 auto;padding:clamp(70px,9vw,120px) var(--gutter) clamp(80px,10vw,130px)}
.p-page-expand{max-width:1280px}
.p-head{text-align:center;max-width:760px;margin:0 auto clamp(46px,6vw,72px)}
.p-head small{font-size:var(--fs-label);letter-spacing:.17em;color:var(--muted);text-transform:uppercase}
.p-head h1{margin:8px 0 20px;font:clamp(46px,6.6vw,84px)/.95 var(--serif);font-weight:400;text-wrap:balance}
.p-head h1 i{font-style:italic}
.p-head p{color:var(--muted);font-size:var(--fs-lead);text-wrap:balance;max-width:640px;margin-left:auto;margin-right:auto}

/* ---- buttons (mirror .notfound-primary / .notfound-secondary / .enquiry-submit) ---- */
.btn-row{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:center}
.btn-row-start{justify-content:flex-start}
.p-btn{display:inline-block;padding:15px 30px;background:var(--maroon);color:#fff;text-align:center;text-transform:uppercase;letter-spacing:.13em;font-size:var(--fs-ui);border:0;cursor:pointer;transition:opacity .25s ease}
.p-btn:hover{opacity:.88}
.p-btn-block{display:block;width:100%}
.p-btn-ghost{display:inline-block;padding-bottom:6px;border-bottom:1px solid var(--ink);text-transform:uppercase;letter-spacing:.13em;font-size:var(--fs-label);transition:opacity .25s ease}
.p-btn-ghost:hover{opacity:.65}
.p-btn-ghost-bare{border-bottom:1px solid rgba(23,19,17,.3)}

/* ---- forms (mirror .enquiry-field language) ---- */
.p-form{display:grid;gap:22px}
.p-form-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.p-field{display:grid;gap:8px;min-width:0}
.p-field label{font-size:var(--fs-label);letter-spacing:.13em;text-transform:uppercase}
.p-optional{text-transform:none;letter-spacing:.04em;color:var(--muted);font-weight:400}
.p-field input,.p-field select,.p-field textarea{width:100%;min-width:0;box-sizing:border-box;border:0;border-bottom:1px solid var(--line);background:transparent;padding:12px 0;font:inherit;color:inherit;outline:none;border-radius:0}
.p-field textarea{resize:vertical;min-height:110px;line-height:1.65}
.p-field input:focus,.p-field select:focus,.p-field textarea:focus{border-color:var(--ink)}
.p-form-note{margin:0;color:var(--muted);font-size:var(--fs-micro);line-height:1.65}
.p-form-note a{text-decoration:underline}
.p-form-meta{display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:space-between;align-items:center;color:var(--muted);font-size:var(--fs-label)}
.p-form-card{background:var(--cream);border:1px solid rgba(23,19,17,.1);padding:clamp(28px,4vw,46px)}
.p-auth{max-width:540px;margin:0 auto}
.p-auth .p-head{margin-bottom:clamp(30px,4vw,46px)}

/* ---- account dashboard cards ---- */
.account-dash{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.dash-card{display:grid;gap:8px;align-content:start;background:var(--cream);border:1px solid rgba(23,19,17,.1);padding:30px 26px;color:inherit;text-decoration:none;transition:transform .4s ease,box-shadow .4s ease}
.dash-card small{font-size:var(--fs-label);letter-spacing:.16em}
.dash-card h3{margin:0;font:clamp(24px,2.6vw,32px) var(--serif);font-weight:400}
.dash-card p{margin:0;color:var(--muted);font-size:var(--fs-body);line-height:1.6}
.dash-card .dash-go{margin-top:12px;align-self:end;font-size:var(--fs-label);letter-spacing:.13em;text-transform:uppercase;color:var(--maroon)}
.dash-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(23,19,17,.14)}
.account-actions{margin-top:clamp(40px,5vw,64px);text-align:center;display:grid;gap:22px}

/* ---- product grid reuse: page variants reuse .collection-grid/.collection-card ---- */
.p-grid-zone{display:grid;gap:clamp(28px,4vw,44px)}
.p-result-count{text-align:center;color:var(--muted);font-size:var(--fs-label);letter-spacing:.1em}
.p-result-count strong{color:var(--ink);font-weight:600}

/* ---- empty / contextual states (mirror .collection-empty language) ---- */
.empty-state{max-width:620px;margin:clamp(16px,3vw,30px) auto 0;padding:clamp(40px,6vw,70px) 20px;text-align:center;border-block:1px solid var(--line)}
.empty-state h2{margin:0;font:clamp(28px,3.6vw,44px) var(--serif);font-weight:400}
.empty-state p{margin:14px auto 0;max-width:440px;color:var(--muted)}
.empty-state .btn-row{margin-top:34px}
.hint-note{text-align:center;color:var(--muted);font-size:var(--fs-label);letter-spacing:.1em;margin-top:clamp(30px,4vw,50px)}
.hint-note a{text-decoration:underline}

/* ---- bag page ---- */
.bag-rows{display:grid;gap:0;max-width:860px}
.bag-row{display:grid;grid-template-columns:86px minmax(0,1fr) auto;gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}
.bag-row:first-child{border-top:1px solid var(--line)}
.bag-thumb{width:86px;aspect-ratio:2/3;background:var(--cream);overflow:hidden}
.bag-thumb img{display:block;width:100%;height:100%;object-fit:contain;background:var(--cream)}
.bag-row-main{min-width:0}
.bag-row-main small{font-size:var(--fs-label);letter-spacing:.13em}
.bag-row-main h3{margin:4px 0 6px;font:24px var(--serif);font-weight:400;overflow-wrap:anywhere}
.bag-qty{color:var(--muted);font-size:var(--fs-micro)}
.bag-remove{justify-self:end;align-self:start;padding-bottom:3px;border:0;border-bottom:1px solid rgba(23,19,17,.3);background:none;color:inherit;font-size:var(--fs-micro);letter-spacing:.13em;text-transform:uppercase;cursor:pointer;transition:opacity .25s ease}
.bag-remove:hover{opacity:.6}
.bag-foot{display:grid;gap:26px;margin-top:clamp(30px,4vw,50px);max-width:860px}
.bag-totals{max-width:420px;margin-left:auto;display:grid;gap:12px}
.bag-total-row{display:flex;justify-content:space-between;gap:18px;padding-top:12px;border-top:1px solid var(--line)}
.bag-total-row small{font-size:var(--fs-label);letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.bag-total-row .bag-total-value{font:15px var(--serif)}
.bag-total-row.is-total{border-top-color:var(--ink)}
.bag-total-row.is-total .bag-total-value{font-size:20px}
.bag-empty{max-width:620px;margin:clamp(16px,3vw,30px) auto 0;padding:clamp(40px,6vw,70px) 20px;text-align:center;border-block:1px solid var(--line)}
.bag-empty h2{margin:0;font:clamp(28px,3.6vw,44px) var(--serif);font-weight:400}
.bag-empty p{margin:14px auto 0;max-width:440px;color:var(--muted)}
.bag-empty .btn-row{margin-top:34px}

/* ---- checkout ---- */
.checkout-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(38px,5vw,72px);align-items:start}
.checkout-section{display:grid;gap:24px;padding-top:30px;border-top:1px solid var(--line)}
.checkout-section>small{font-size:var(--fs-label);letter-spacing:.17em}
.checkout-section h2{margin:0;font:clamp(26px,3vw,38px) var(--serif);font-weight:400}
.order-summary{position:sticky;top:calc(var(--headerH) + 24px);display:grid;gap:18px;background:var(--cream);border:1px solid rgba(23,19,17,.1);padding:clamp(26px,3.5vw,40px)}
.order-summary small{font-size:var(--fs-label);letter-spacing:.16em}
.order-summary h2{margin:0;font:clamp(26px,3vw,38px) var(--serif);font-weight:400}
.order-summary-empty{color:var(--muted);font-size:var(--fs-micro);line-height:1.65}
.checkout-note{color:var(--muted);font-size:var(--fs-micro);line-height:1.65}

/* ---- order confirmation ---- */
.order-confirm{max-width:820px;margin:0 auto;text-align:center}
.order-confirm .p-btn-row{justify-content:center}
.order-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-top:clamp(36px,5vw,56px);text-align:left}
.order-fact{background:var(--cream);border:1px solid rgba(23,19,17,.1);padding:22px 20px;display:grid;gap:8px}
.order-fact small{font-size:var(--fs-label);letter-spacing:.14em}
.order-fact strong{font:18px var(--serif);font-weight:400;color:var(--ink)}
.order-fact span{color:var(--muted);font-size:var(--fs-micro);line-height:1.6}
.order-confirm-note{margin-top:clamp(28px,4vw,44px);color:var(--muted);font-size:var(--fs-micro);line-height:1.65}

/* ---- order tracking ---- */
.panel-block{max-width:720px;margin:0 auto}
.track-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:clamp(30px,4vw,44px) 0 0}
.track-step{position:relative;display:grid;gap:10px;padding-top:22px}
.track-step::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--line)}
.track-step::after{content:"";position:absolute;top:-4px;left:0;width:10px;height:10px;border-radius:50%;background:var(--line)}
.track-step small{font-size:var(--fs-micro);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.track-step .track-state{color:var(--muted);font-size:var(--fs-micro)}
.track-none{text-align:center;color:var(--muted);font-size:var(--fs-micro);letter-spacing:.1em;margin-top:clamp(24px,3vw,36px)}

/* ---- FAQ (keyboard-accessible editorial accordion) ---- */
.faq-cats{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0 0 clamp(34px,4vw,52px)}
.faq-chip{padding:8px 16px;border:1px solid var(--line);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.faq-list{max-width:860px;margin:0 auto;border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 2px;background:none;border:0;text-align:left;font:clamp(21px,2.4vw,28px) var(--serif);font-weight:400;color:var(--ink);cursor:pointer}
.faq-q .faq-icon{flex:0 0 auto;font-size:26px;font-weight:300;color:var(--muted);transition:transform .3s ease}
.faq-item.open .faq-q .faq-icon{transform:rotate(45deg);color:var(--ink)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
.faq-item.open .faq-a{grid-template-rows:1fr}
.faq-a-inner{overflow:hidden;min-height:0}
.faq-a-inner p{margin:0;padding:0 2px 22px;color:var(--muted);max-width:640px;line-height:1.75}
.faq-a-inner p:first-child{padding-top:2px}
.faq-eyebrow{text-align:center;color:var(--muted);font-size:var(--fs-label);letter-spacing:.16em;margin-top:clamp(28px,4vw,44px)}

/* ---- legal / information ---- */
.legal{max-width:780px;margin:0 auto}
.legal section{display:grid;gap:12px;margin-top:clamp(30px,4vw,48px)}
.legal section:first-of-type{margin-top:0}
.legal h2{margin:0;font:clamp(24px,3vw,36px) var(--serif);font-weight:400}
.legal p{margin:0;color:var(--muted);line-height:1.75}
.legal a{text-decoration:underline}
.legal-note{background:var(--cream);border:1px solid rgba(23,19,17,.1);padding:16px 20px;color:#6f665d;font-size:var(--fs-micro);line-height:1.65}
.legal-updated{margin:0 auto clamp(20px,3vw,32px);text-align:center;color:var(--muted);font-size:var(--fs-micro);letter-spacing:.1em}
.legal li{color:var(--muted);line-height:1.75;margin-top:8px}

/* ---- back links (page head suite for sub-account pages / legal) ---- */
.p-back{display:inline-block;margin-bottom:28px;padding-bottom:4px;border-bottom:1px solid rgba(23,19,17,.3);font-size:var(--fs-label);letter-spacing:.13em;text-transform:uppercase;color:var(--ink);transition:opacity .25s ease}
.p-back:hover{opacity:.6}

/* ---- responsive ---- */
@media(max-width:900px){.checkout-layout{grid-template-columns:1fr}.order-summary{position:static}.p-form-row{grid-template-columns:1fr}}
@media(max-width:650px){
 .p-form-row{grid-template-columns:1fr}
 .bag-row{grid-template-columns:70px minmax(0,1fr);gap:14px}
 .bag-thumb{width:70px}
 .bag-remove{grid-column:2;justify-self:start}
 .bag-row-main h3{font-size:21px}
 .track-steps{grid-template-columns:1fr;gap:0}
 .track-step::before{top:auto;bottom:-1px;left:0;right:auto;width:2px;height:0}
 .track-step{grid-template-columns:14px 1fr;gap:8px;padding:14px 0}
 .track-step::after{top:8px;left:2px}
 .track-step::before{left:7px;right:auto;bottom:0;top:auto;width:2px;height:calc(100% - 14px)}
}
@media(prefers-reduced-motion:reduce){.p-btn,.p-btn-ghost,.dash-card,.bag-remove,.faq-q .faq-icon,.faq-a,.p-back{transition:none}}
.account-guest{display:grid;gap:14px;justify-items:center;text-align:center;max-width:560px;margin:0 auto clamp(34px,4.5vw,56px);padding:clamp(26px,4vw,40px);background:var(--cream);border:1px solid rgba(23,19,17,.1)}
.account-guest h2{margin:0;font:clamp(26px,3vw,38px) var(--serif);font-weight:400}
.account-guest p{margin:0;color:var(--muted);max-width:440px;line-height:1.65}