/* GARANTİ Pages 0.2.0: design clarity layer (product, quote, My GARANTİ and access routes).
   Brand font inherited (New Science), brand colours only. One spacing rhythm (8 px base; 56/40 px sections),
   one heading scale, frames only for selectable items and meaningful states. No motion beyond colour changes. */

:is(#gpp,#gpl,#gqp,.gp-portal,.gam-membership-access,.gpx){--c-red:#d7242f;--c-red-d:#b21d27;--c-ink:#202326;--c-ink-2:#3f4449;--c-muted:#5f6469;--c-line:#e3e1dc;--c-soft:#f6f5f3;--c-top:calc(84px + var(--gw-invite-h, 0px))}
@media(max-width:760px){:is(#gpp,#gpl,#gqp,.gp-portal,.gam-membership-access,.gpx){--c-top:70px}}
/* signed-in staff: the WordPress admin bar pushes the fixed site header down (hub: 32 px, 46 px at ≤782 px) */
body.admin-bar :is(#gpp,#gpl,#gqp,.gp-portal,.gam-membership-access,.gpx){--c-top:calc(116px + var(--gw-invite-h, 0px))}
@media(max-width:782px){body.admin-bar :is(#gpp,#gpl,#gqp,.gp-portal,.gam-membership-access,.gpx){--c-top:130px}}
@media(max-width:760px){body.admin-bar :is(#gpp,#gpl,#gqp,.gp-portal,.gam-membership-access,.gpx){--c-top:116px}}

/* ---------- Shared: native disclosure (layered detail, keyboard operable, content stays in the HTML) ---------- */
.gp-disclose{border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line);margin:0;padding:0;background:transparent}
.gp-disclose+.gp-disclose{border-top:0}
.gp-disclose>summary{display:flex;align-items:center;gap:12px;min-height:56px;padding:12px 0;cursor:pointer;list-style:none;color:var(--c-ink);font-weight:650;font-size:17px;line-height:1.35}
.gp-disclose>summary::-webkit-details-marker{display:none}
.gp-disclose>summary::after{content:"+";margin-left:auto;flex:none;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--c-line);border-radius:50%;font-size:18px;font-weight:400;line-height:1;color:var(--c-red-d);background:#fff}
.gp-disclose[open]>summary::after{content:"–"}
.gp-disclose>summary:hover .gp-disclose__t{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--c-line)}
.gp-disclose>summary:focus-visible{outline:2px solid var(--c-red);outline-offset:3px}
.gp-disclose__t{min-width:0}
.gp-disclose__n{flex:none;font-size:14px;font-weight:500;color:var(--c-muted)}
.gp-disclose[open]>summary{margin-bottom:8px}
.gp-disclose>:not(summary){margin-bottom:20px}

/* ---------- Product local navigation (sticky under the site header) ---------- */
.gpn{position:sticky;top:var(--c-top);z-index:60;background:rgba(255,255,255,.97);border-bottom:1px solid var(--c-line);font-family:inherit}
.gpn-in{display:flex;align-items:center;gap:20px;min-height:60px}
.gpn .gpn-model{flex:none;margin:0!important;padding:0;font-size:17px;font-weight:650;letter-spacing:-.01em;color:var(--c-ink);white-space:nowrap}
.gpn .gpn-links{display:flex;align-items:center;gap:2px;flex:1 1 auto;min-width:0;margin:0!important;padding:0!important;list-style:none!important;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.gpn .gpn-links::-webkit-scrollbar{display:none}
.gpn .gpn-links li{list-style:none!important;margin:0!important;padding:0!important;flex:none}
.gpn .gpn-links li::before{content:none!important}
.gpn .gpn-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-size:14px;font-weight:600;color:var(--c-muted)!important;text-decoration:none!important;white-space:nowrap;border-bottom:2px solid transparent}
.gpn .gpn-links a:hover,.gpn .gpn-links a[aria-current=true]{color:var(--c-ink)!important}
.gpn .gpn-links a[aria-current=true]{border-bottom-color:var(--c-red)}
.gpn .gpn-act{display:flex;align-items:center;gap:6px;flex:none;margin-left:auto}
.gpn .gpn-chat{display:inline-flex;align-items:center;gap:8px;min-height:44px;min-width:44px;justify-content:center;padding:0 10px;font-size:14px;font-weight:600;color:var(--c-ink)!important;text-decoration:none!important}
.gpn .gpn-chat:hover{color:var(--c-red-d)!important}
.gpn .gpn-chat .gp-ico{width:18px;height:18px;color:var(--c-red-d)}
.gpn .gpn-cta,#gpp .gpn .gpn-cta,#gpl .gpn .gpn-cta{min-height:44px;padding:10px 18px;font-size:14px;transition:opacity .15s linear}
.gpn a:focus-visible{outline:2px solid var(--c-red);outline-offset:2px}
/* JS only: the nav's quote button appears once the hero's own button has left the viewport (one primary action on screen) */
.gpn.is-hero .gpn-cta{opacity:0;visibility:hidden}
/* anchor targets clear the header and the local navigation */
:is(#gpp,#gpl) :is(.gpp-sec,.gpl-sec,#gpp-gallery,#gpp-specs,#gpp-faq,#technical-data,#gpl-more,#compare,#compare-table,#models){scroll-margin-top:calc(var(--c-top) + 76px)!important}
#gpl{scroll-margin-top:var(--c-top)}

/* ---------- Product hero: one alignment for both templates ---------- */
#gpp .gpp-hero{padding:56px 0 0}
#gpp .gpp-facts{margin-top:44px!important}
#gpp .gpp-facts dd,#gpl .gpl-specs dd{font-variant-numeric:tabular-nums}
#gpl .gpl-head{padding:44px 0 52px}
#gpl .gpl-specs div{padding:14px 0 12px}
#gpl .gpl-links{gap:2px 22px}

/* ---------- A120 / A240: layered secondary tables ---------- */
#gpp .gpp-more{margin:32px 0 0;max-width:none}
#gpp .gpp-more .gp-disclose{background:transparent}
#gpp .gpp-more .gpp-table-wrap{margin:0 0 20px}
#gpp .gpp-more .gpp-options{margin-top:0}
#gpp .gpp-more .gpp-table caption{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Legacy: model values first, family comparison in place ---------- */
#gpl .gpl-model dd.is-ref a{font-size:inherit!important;font-weight:600;color:var(--c-red-d)!important;text-decoration:underline;text-underline-offset:3px}
#gpl .gpl-compare{margin:32px 0 36px}
#gpl .gpl-compare>summary{font-size:17px}
#gpl .gpl-compare .gpl-table{margin:0}
#gpl .gpl-compare .gpl-sub{margin:4px 0 8px!important}
#gpl .gpl-sec--specs .gpl-model+*{margin-top:0}
#gpl .gpl-sec--specs>.gwh-wrap:last-child{padding-bottom:12px}

/* ---------- Explore models: own family as direct choices, other families in place ---------- */
.gpx .gpx-pick{list-style:none!important;margin:0 0 28px!important;padding:0!important;display:grid;grid-template-columns:repeat(auto-fill,minmax(188px,1fr));gap:12px}
.gpx .gpx-pick li{list-style:none!important;margin:0!important;padding:0!important}
.gpx .gpx-pick li::before{content:none!important}
.gpx .gpx-pick a{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:68px;height:100%;padding:12px 16px;border:1px solid #d5d7d9;border-radius:6px;background:#fff;color:var(--c-ink)!important;text-decoration:none!important}
.gpx .gpx-pick a strong{font-size:16px;font-weight:650;line-height:1.25}
.gpx .gpx-pick a span{font-size:13px;color:var(--c-muted);line-height:1.35}
.gpx .gpx-pick a:hover{border-color:var(--c-red-d)}
.gpx .gpx-pick a:hover strong{color:var(--c-red-d)}
.gpx .gpx-fams{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));column-gap:32px;align-items:start;margin:0 0 6px}
.gpx .gpx-fam{border-top:1px solid var(--c-line)!important;border-bottom:1px solid var(--c-line)!important;margin-top:-1px}
.gpx .gpx-fam>summary{font-size:16px;min-height:52px}
.gpx .gpx-fam .gpx-links{margin:0 0 16px!important}
.gpx .gpx-links a span{font-weight:500;color:var(--c-muted);font-size:13px;margin-left:4px}
.gpx .gpx-group{margin:20px 0 12px!important}
.gpx .gpx-title+.gpx-group{margin-top:14px!important}

/* ---------- Request a quote: numbered sections (visual guide only; native form, order and errors unchanged) ---------- */
#gqp .gqp-form__native{counter-reset:gqp-step}
#gqp .gqp-form__native .gqp-group{counter-increment:gqp-step;display:flex;align-items:center;gap:12px}
#gqp .gqp-form__native .gqp-group::before{content:counter(gqp-step);flex:none;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--c-ink);color:#fff;font-size:14px;font-weight:700;letter-spacing:0}
#gqp .gqp-model{gap:6px 14px}
#gqp .gqp-head{padding:52px 0 40px}
#gqp .gqp-card{border-radius:8px;padding:24px}
#gqp .gqp-next{counter-reset:none}

/* ---------- My GARANTİ: one calm rhythm, frames for states and selectable items ---------- */
body.gp-focus-portal .gp-portal{max-width:960px}
body.gp-focus-portal .gp-portal .gp-lead{margin:0 0 24px!important}
body.gp-focus-portal .gp-portal :is(.gp-card,article.gp-offer){border-radius:8px}
body.gp-focus-portal .gp-portal .gp-card__label,body.gp-focus-portal .gp-portal .gp-status-label{font-size:12px!important;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--c-muted)}
/* status cards side by side (owner), one row on mobile each */
body.gp-focus-portal .gp-portal .gp-status{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:0 0 24px}
body.gp-focus-portal .gp-portal .gp-status>.gp-status-card{margin:0!important}
/* owner machines: name, facts as a definition grid, one notice line, quiet pricing note */
body.gp-focus-portal .gp-portal article.gp-machine{padding:24px!important;margin:0 0 16px!important}
body.gp-focus-portal .gp-portal article.gp-machine>h2{font-size:22px!important;margin:0 0 14px!important}
body.gp-focus-portal .gp-portal .gp-machine__facts{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:0 24px;margin:0 0 14px!important;padding:0;border-top:1px solid var(--c-line)}
body.gp-focus-portal .gp-portal .gp-machine__facts div{padding:12px 0;border-bottom:1px solid var(--c-line)}
body.gp-focus-portal .gp-portal .gp-machine__facts dt{margin:0 0 2px;padding:0;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--c-muted)}
body.gp-focus-portal .gp-portal .gp-machine__facts dd{margin:0;padding:0;font-size:16px;font-weight:600;color:var(--c-ink);line-height:1.4}
body.gp-focus-portal .gp-portal .gp-machine__due{margin:0 0 12px!important;padding:10px 14px;border-left:3px solid #c98a00;background:#fffbf2;font-size:15px;font-weight:600;color:#5c3f00}
body.gp-focus-portal .gp-portal article.gp-machine h3{font-size:16px!important;margin:18px 0 6px!important}
body.gp-focus-portal .gp-portal .gp-machine__note{margin:16px 0 0;padding:12px 0 0;border-top:1px dashed var(--c-line)}
body.gp-focus-portal .gp-portal .gp-machine__note p{margin:0 0 4px!important;font-size:14px;color:var(--c-muted)}
/* selected offers for the owner: a list, not loose lines */
body.gp-focus-portal .gp-portal .gp-picks{margin:32px 0 24px}
body.gp-focus-portal .gp-portal .gp-picks h2{font-size:22px!important;margin:0 0 10px!important}
body.gp-focus-portal .gp-portal .gp-picks__list{list-style:none!important;margin:0!important;padding:0!important;border-top:1px solid var(--c-line)}
body.gp-focus-portal .gp-portal .gp-picks__list li{list-style:none!important;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 16px;min-height:52px;margin:0!important;padding:8px 0!important;border-bottom:1px solid var(--c-line)}
body.gp-focus-portal .gp-portal .gp-picks__list li::before{content:none!important}
body.gp-focus-portal .gp-portal .gp-picks__list span{font-weight:600;color:var(--c-ink)}
body.gp-focus-portal .gp-portal .gp-picks__list a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--c-red-d)!important}
/* machines section and empty states: open, not boxed twice */
body.gp-focus-portal .gp-portal .gp-section{margin:36px 0 20px}
body.gp-focus-portal .gp-portal .gp-empty{padding:14px 16px;border:1px dashed #d5d7d9;border-radius:8px;background:transparent;color:var(--c-muted)}
body.gp-focus-portal .gp-portal .gp-activity{margin-top:32px}
/* one primary action per card; secondary actions stay links */
body.gp-focus-portal .gp-portal .gp-quicklinks{margin:0 0 6px!important;font-size:15px}
body.gp-focus-portal .gp-portal .gp-quicklinks a{display:inline-flex;align-items:center;min-height:44px}

/* ---------- Sign in / register: same rhythm ---------- */
body.gp-focus-access .gam-membership-access{column-gap:56px}
body.gp-focus-access .gp-access-form{border-radius:8px}
body.gp-focus-access .gp-access-form :is(input:not([type=checkbox]):not([type=hidden]),select){font-size:16px!important}
body.gp-focus-access .gp-workspace__list li{padding:0 0 14px;border-bottom:1px solid var(--c-line,#e3e1dc)}
body.gp-focus-access .gp-workspace__list li:last-child{border-bottom:0;padding-bottom:0}

/* ---------- Mobile ---------- */
@media(max-width:900px){
  .gpn .gpn-model{display:none}
  .gpn-in{gap:8px;min-height:52px}
  .gpn .gpn-links{-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
  .gpn .gpn-links a{padding:0 10px}
  .gpn .gpn-chat span{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .gpn .gpn-chat{padding:0}
  .gpn .gpn-cta,#gpp .gpn .gpn-cta,#gpl .gpn .gpn-cta{padding:10px 14px}
  .gpn.is-hero .gpn-act{gap:0}
  .gpn.is-hero .gpn-cta{display:none}
  #gpp .gpp-hero{padding-top:32px}
  #gpl .gpl-head{padding:24px 0 32px}
}
@media(max-width:760px){
  :is(#gpp,#gpl) :is(.gpp-sec,.gpl-sec,#gpp-gallery,#gpp-specs,#gpp-faq,#technical-data,#gpl-more,#compare,#compare-table,#models){scroll-margin-top:calc(var(--c-top) + 64px)!important}
  .gpx .gpx-pick{grid-template-columns:1fr 1fr;gap:10px}
  .gpx .gpx-pick a{min-height:60px;padding:10px 12px}
  .gpx .gpx-pick a strong{font-size:15px}
  .gp-disclose>summary{font-size:16px}
  body.gp-focus-portal .gp-portal article.gp-machine{padding:18px 16px!important}
  body.gp-focus-portal .gp-portal .gp-machine__facts{grid-template-columns:1fr 1fr;gap:0 16px}
  #gqp .gqp-head{padding:32px 0 28px}
}
@media(max-width:420px){#gpp .gpp-facts{grid-template-columns:1fr 1fr}#gpp .gpp-facts div{padding:12px 12px 12px 0!important}}
@media(max-width:380px){.gpx .gpx-pick{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.gpn *,.gp-disclose *{transition:none!important}}
@media(forced-colors:active){.gpx .gpx-pick a,.gp-disclose>summary::after{border:1px solid CanvasText}}

/* 0.2.3 A120/A240 (#gpp): same phone order as the other product pages: model, photo, short intro, one quote action,
   then the decision values. Desktop layout unchanged. */
@media(max-width:900px){
  #gpp .gpp-hero__in{display:flex;flex-direction:column;gap:0}
  #gpp .gpp-hero__text{display:contents}
  #gpp .gpp-hero__text>.gqp-eyebrow{order:1}
  #gpp .gpp-hero__text>.gpp-title{order:2}
  #gpp .gpp-hero__text>.gpp-sub{order:3}
  #gpp .gpp-hero__media{order:4;margin:18px 0 0}
  #gpp .gpp-hero__text>.gpp-intro{order:5;margin-top:18px}
  #gpp .gpp-hero__text>.gqp-actions{order:6;margin-top:16px}
  #gpp .gqp-actions .gqp-btn{flex:1 1 100%}
}
/* 0.2.3 product nav on phones: short quote label so the section links keep their room (accessible name stays
   "Quote for <model>"; desktop shows "Request a quote"). */
.gpn .gpn-cta__short{display:none}
@media(max-width:600px){.gpn .gpn-cta__full{display:none}.gpn .gpn-cta__short{display:inline}}
/* 0.2.3: category link above the product name is a 44 px target without moving the text. */
#gpp .gqp-eyebrow a,#gpl .gpl-eyebrow a{display:inline-block;padding:15px 0;margin:-15px 0}

/* 0.2.4 product nav on phones: every section link and the quote button readable without sideways scrolling.
   Chat leaves the phone nav (WhatsApp stays in the quote page contacts and the footer); links share the row evenly;
   no fade mask. Desktop unchanged. */
@media(max-width:600px){
  .gpn .gpn-chat{display:none}
  .gpn-in{gap:6px}
  .gpn .gpn-links{-webkit-mask-image:none;mask-image:none;justify-content:space-between;gap:0}
  .gpn .gpn-links li{flex:1 1 auto}
  .gpn .gpn-links a{justify-content:center;width:100%;padding:0 4px;font-size:14px}
  .gpn .gpn-cta,#gpp .gpn .gpn-cta,#gpl .gpn .gpn-cta{padding:10px 14px}
}
@media(max-width:360px){
  .gpn .gpn-in{gap:2px;width:100%!important;max-width:none!important;margin:0!important;box-sizing:border-box;padding-left:12px!important;padding-right:12px!important}
  .gpn .gpn-links a{padding:0 2px;font-size:13px;letter-spacing:-.01em}
  .gpn .gpn-cta,#gpp .gpn .gpn-cta,#gpl .gpn .gpn-cta{padding:10px 9px}
}
