/* GARANTİ Pages 0.2.2: grinder layer (#gpl.gpl--v3; loaded on the 13 grinder product posts only).
   Product photo first on its own stage, a short value line, the decision values and one quote action; technical data,
   the product's own feature content and downloads follow in layers. New Science and brand colours inherited.
   Roaster and other product pages do not load this file and render as before. */
#gpl.gpl--v3{--g-stage:#efedea;--g-ink:#202326;--g-muted:#5f6469;--g-line:#e3e1dc;--g-red:#d7242f;--g-red-d:#b21d27}
#gpl.gpl--v3 .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 1. Hero: photo stage left, product information right (desktop); title, photo, decision on phones */
#gpl.gpl--v3 .gpl-head{background:#fff;padding:32px 0 52px;border-bottom:1px solid var(--g-line)}
#gpl.gpl--v3 .gpl-head__in{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-rows:auto auto;grid-template-areas:"media intro" "media decide";column-gap:64px;row-gap:28px;align-items:end}
#gpl.gpl--v3 .gpl-intro{align-self:end}
#gpl.gpl--v3 .gpl-decide{align-self:start}
#gpl.gpl--v3 .gpl-media{position:relative;display:flex;align-items:center;justify-content:center;min-height:min(640px,72vh);margin:0;padding:48px;background:var(--g-stage);border:0;border-radius:12px;overflow:hidden}
#gpl.gpl--v3 .gpl-media img{display:block;width:auto;max-width:100%;max-height:min(600px,64vh);height:auto;object-fit:contain;mix-blend-mode:multiply}
#gpl.gpl--v3 .gpl-title{font-size:clamp(36px,4.6vw,60px)!important;line-height:1.02!important;margin:0 0 14px!important}
#gpl.gpl--v3 .gpl-use{font-size:clamp(18px,1.5vw,21px);color:#3f4449;max-width:30ch}
/* decision values: a short strip of real table values, large numerals, one rule above each */
#gpl.gpl--v3 .gpl-specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:0 20px;margin:0 0 28px!important}
#gpl.gpl--v3 .gpl-specs div{display:flex;flex-direction:column;padding:12px 0 0;border-top:2px solid var(--g-ink)}
#gpl.gpl--v3 .gpl-specs dd{margin-top:auto}
#gpl.gpl--v3 .gpl-specs dt{font-size:11.5px;letter-spacing:.08em;line-height:1.35;margin:0 0 6px}
#gpl.gpl--v3 .gpl-specs dd{font-size:clamp(19px,1.8vw,24px);font-weight:650;letter-spacing:-.01em;line-height:1.2;font-variant-numeric:tabular-nums}
#gpl.gpl--v3 .gpl-cta{width:100%;max-width:420px}

#gpl.gpl--v3 .gpl-eyebrow a{display:inline-block;padding:15px 0;margin:-15px 0}

/* 2. Technical data: feature markers from the model's own table column */
#gpl.gpl--grinder .gpl-model dd.is-yes{display:inline-flex;align-items:center;gap:6px;color:#1e6b3a}
#gpl.gpl--grinder .gpl-model dd.is-yes .gp-ico{width:16px;height:16px;flex:none}
#gpl.gpl--v3 .gpl-model dd.is-ref a{display:inline-block;padding:12px 0;margin:-12px 0}
#gpl.gpl--grinder .gpl-model dd.is-no{color:var(--g-muted);font-weight:500}

/* 3. The product's own feature content: one calm type scale; the "icon + label + values" spec rows become a tidy grid */
#gpl.gpl--v3 .gpl-sec--more{background:#fff;padding-top:8px}
#gpl.gpl--v3 .gpl-more>summary{min-height:64px}
#gpl.gpl--v3 .gpl-more>summary h2.gpl-sec-title{margin:0!important;padding:0!important;font-size:clamp(20px,2vw,24px)!important;line-height:1.3!important}
#gpl.gpl--v3 .gpl-more[open]>summary{margin-bottom:24px}
#gpl.gpl--v3 .gpl-more .gpl-block{padding:0}
#gpl.gpl--v3 .gpl-block .img-with-aniamtion-wrap:not(:has(img)),#gpl.gpl--v3 .gpl-block .wpb_column:not(:has(img,p,h3,h4,h5,h6,li,table,a,strong)){display:none}
#gpl.gpl--v3 .gpl-block :is(h1,h2){font-size:clamp(24px,2.4vw,30px)!important;line-height:1.2!important;letter-spacing:-.02em!important}
#gpl.gpl--v3 .gpl-block :is(h3,h4){font-size:clamp(18px,1.6vw,21px)!important;line-height:1.3!important}
#gpl.gpl--v3 .gpl-block .nectar-split-heading :is(h1,h2,h3,h4,span){font-size:clamp(24px,2.4vw,30px)!important;line-height:1.2!important}
#gpl.gpl--v3 .gpl-block .iwithtext{display:flex;align-items:center;gap:12px;margin:0 0 8px!important}
#gpl.gpl--v3 .gpl-block .iwithtext .iwt-icon{flex:none;width:36px;height:36px;margin:0!important;float:none!important;display:flex;align-items:center;justify-content:center}
#gpl.gpl--v3 .gpl-block .iwithtext .iwt-icon img{width:auto!important;max-width:36px!important;max-height:36px!important;height:auto;object-fit:contain}
#gpl.gpl--v3 .gpl-block .iwithtext .iwt-text{padding:0!important;margin:0!important}
#gpl.gpl--v3 .gpl-block .iwithtext .iwt-text strong{font-size:17px!important;font-weight:650;line-height:1.3;color:var(--g-ink)}
#gpl.gpl--v3 .gpl-block .iwithtext ~ .nectar-responsive-text,#gpl.gpl--v3 .gpl-block .iwithtext ~ .nectar-responsive-text :is(p,strong,span,b){font-size:15px!important;line-height:1.65!important;font-weight:500!important;letter-spacing:0!important;color:#3f4449}
#gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext){margin:0!important}
#gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext) .child_column{padding:18px 24px 18px 0!important;border-top:1px solid var(--g-line);margin-bottom:0!important}
#gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext) :is(.child_column,.vc_column-inner,.wpb_wrapper,.iwithtext,.iwt-text,.nectar-responsive-text,p){text-align:left!important}
#gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext) .iwithtext{justify-content:flex-start}
#gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext) .vc_column-inner{align-items:stretch!important}
#gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext) .wpb_wrapper{width:100%}
#gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext) .iwithtext ~ .nectar-responsive-text{padding-left:48px}
/* content photos: never taller than the screen; the hero already carries the main product shot */
#gpl.gpl--v3 .gpl-block img{max-height:min(440px,60vh);width:auto;max-width:100%;height:auto;object-fit:contain}

/* 4. Documents: existing documents and support topics as clear, tappable rows */
#gpl.gpl--v3 .gpl-sec--docs{background:#fff}
#gpl .gpl-docs{list-style:none!important;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:0 0 44px!important;padding:0!important}
#gpl .gpl-docs li{list-style:none!important;margin:0!important;padding:0!important}
#gpl .gpl-docs li::before{content:none!important}
#gpl .gpl-docs a{display:flex;align-items:center;gap:14px;min-height:68px;height:100%;padding:14px 16px;border:1px solid #d5d7d9;border-radius:8px;background:#fff;color:var(--g-ink)!important;text-decoration:none!important}
#gpl .gpl-docs a:hover{border-color:var(--g-red-d)}
#gpl .gpl-docs a:hover strong{color:var(--g-red-d)}
#gpl .gpl-docs .gp-ico{width:22px;height:22px;color:var(--g-red-d);flex:none}
#gpl .gpl-docs span{display:flex;flex-direction:column;gap:2px;min-width:0}
#gpl .gpl-docs strong{font-size:16px;font-weight:650;line-height:1.3}
#gpl .gpl-docs small{font-size:13px;color:var(--g-muted);line-height:1.35}
#gpl .gpl-docs a:focus-visible{outline:2px solid var(--g-red);outline-offset:3px}

/* Phones: title → photo → value line → decision values → one quote action */
/* 5. One My GARANTİ line instead of a band of repeated links (the footer keeps service, parts and plans) */
#gpl.gpl--v3 .gpl-owner{padding:28px 0;background:var(--gp-soft,#f6f4f1);border-top:0}
#gpl.gpl--v3 .gpl-owner__in{grid-template-columns:minmax(0,1fr) auto;gap:4px 32px}
#gpl.gpl--v3 .gpl-owner h2{grid-column:1;font-size:18px!important;margin:0!important}
#gpl.gpl--v3 .gpl-owner p{grid-column:1;font-size:15px}
#gpl.gpl--v3 .gpl-owner__go{grid-column:2;grid-row:1/3;display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--g-ink);border-radius:6px;font-weight:650;color:var(--g-ink)!important;text-decoration:none!important;white-space:nowrap}
#gpl.gpl--v3 .gpl-owner__go:hover{border-color:var(--g-red-d);color:var(--g-red-d)!important}
#gpl.gpl--v3 .gpl-owner__go:focus-visible{outline:2px solid var(--g-red);outline-offset:3px}

@media(max-width:900px){
  #gpl.gpl--v3 .gpl-head{padding:20px 0 32px}
  #gpl.gpl--v3 .gpl-head__in{grid-template-columns:1fr;grid-template-areas:"intro" "media" "decide";row-gap:18px}
  #gpl.gpl--v3 .gpl-media{min-height:0;aspect-ratio:1/1;max-height:min(46vh,420px);padding:20px;border-radius:10px}
  #gpl.gpl--v3 .gpl-media img{max-height:100%}
  #gpl.gpl--v3 .gpl-use{font-size:17px;max-width:none}
  #gpl.gpl--v3 .gpl-specs{grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:0 14px;margin:0 0 20px!important}
  #gpl.gpl--v3 .gpl-specs dd{font-size:18px}
  #gpl.gpl--v3 .gpl-cta{max-width:none}
  #gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext) .child_column{padding:16px 0!important}
  #gpl.gpl--v3 .gpl-block .inner_row:has(.iwithtext) .iwithtext ~ .nectar-responsive-text{padding-left:0}
  #gpl .gpl-docs{grid-template-columns:1fr;margin-bottom:32px!important}
  #gpl.gpl--v3 .gpl-owner__in{grid-template-columns:1fr}
  #gpl.gpl--v3 .gpl-owner__go{grid-column:1;grid-row:auto;justify-self:start;margin-top:12px}
}
@media(max-width:360px){
  #gpl.gpl--v3 .gpl-specs{grid-template-columns:repeat(auto-fit,minmax(78px,1fr));gap:0 10px}
  #gpl.gpl--v3 .gpl-specs dt{font-size:10.5px;letter-spacing:.05em}
  #gpl.gpl--v3 .gpl-specs dd{font-size:16px}
  #gpl.gpl--v3 .gpl-media{max-height:min(40vh,300px)}
}
@media(prefers-reduced-motion:reduce){#gpl.gpl--v3 *{transition:none!important}}
@media(forced-colors:active){#gpl .gpl-docs a{border:1px solid CanvasText}#gpl.gpl--v3 .gpl-media img{mix-blend-mode:normal}}
/* 0.2.3: the three owner destinations of the earlier band (same URLs as before and as the footer) stay as one quiet line. */
#gpl.gpl--v3 .gpl-owner__more{grid-column:1;margin:6px 0 0!important;font-size:14px!important;color:var(--g-muted)}
#gpl.gpl--v3 .gpl-owner__more a{font-size:14px!important;display:inline-flex;align-items:center;min-height:44px;color:var(--g-ink)!important;font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#c9c6c0}
#gpl.gpl--v3 .gpl-owner__more a:hover{color:var(--g-red-d)!important;text-decoration-color:currentColor}
@media(max-width:900px){#gpl.gpl--v3 .gpl-owner__more{grid-row:auto}}
