/* Kodros story system (owner order 2026-11-04): the home page's template, shared by every page.
   Classical and restrained: warm paper, Cormorant display, Inter for reading, glory gold for fine lines only.
   Photographs are stewardship still lifes and landscapes (assets/kodros/plates/), never computer hardware.
   Load order: tokens.css, ui.css, site.css, shell.css, story.css, then a page stylesheet.
   Components: page head (.st-head) with its plate, chapters (.st-ch, .st-plate),
   text bands (.st-band), ruled rows (.st-rows), the night chapter (.st-night), the close (.mk-close, .st-today),
   reading layout (.st-read) and the gold pill buttons. Every animation sits inside prefers-reduced-motion: no-preference
   and moves opacity, transform or clip-path only. */

:root{
  --st-hero-bg:#F8F1E4;
  --st-ink:#17130D;
  --st-ink-2:#4A4439;
  --st-muted:var(--mk-muted);
  --st-rule:var(--mk-line);
  --st-gold:var(--mk-gold);
  --st-gold-ink:var(--mk-gold-ink);
  --st-gold-soft:var(--mk-gold-soft);
  --st-gold-hi:#DDBB6E;
  --st-gold-lo:#C79F50;
  --st-on-gold:#21180A;
  --st-paper:var(--mk-paper);
  --st-cloud:var(--mk-paper-2);
  --st-card:#FFFEFB;
  --st-mask:#000;
  --st-night:#0E1018;
  --st-on-night:#F4EEDF;
  --st-on-night-2:#D3CAB6;
  --st-paper-0:rgba(253,252,249,0);
  --st-ease:var(--mk-ease);
  --st-pad:clamp(96px,11vw,184px);
  --st-gap:clamp(24px,3.2vw,56px);
  --st-gold-gloss:rgba(255,255,255,.45);
  --st-gold-cast:rgba(140,100,30,.6);
  --st-gold-cast-2:rgba(140,100,30,.65);
}

/* ---------- Buttons: one primary style, the gold pill; the secondary is white on a hairline ---------- */
main .btn--cta{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 32px;border-radius:999px;font-weight:600;letter-spacing:.005em;text-decoration:none;transition:transform 500ms var(--st-ease),box-shadow 500ms var(--st-ease),filter 500ms var(--st-ease),border-color 300ms var(--st-ease)}
main .btn--cta:not(.btn--white){border:0;background:linear-gradient(180deg,var(--st-gold-hi) 0%,var(--st-gold-lo) 100%);color:var(--st-on-gold);box-shadow:inset 0 1px 0 var(--st-gold-gloss),0 10px 24px -12px var(--st-gold-cast)}
main .btn--cta:not(.btn--white):hover{transform:translateY(-1px);filter:brightness(1.04);color:var(--st-on-gold);box-shadow:inset 0 1px 0 var(--st-gold-gloss),0 14px 30px -12px var(--st-gold-cast-2)}
main .btn--cta.btn--white{border:1px solid var(--mk-line-strong);background:var(--st-card);color:var(--st-ink)}
main .btn--cta.btn--white:hover{border-color:var(--st-gold);color:var(--st-ink)}
main .btn--cta:active{transform:translateY(0) scale(.98)}
main .btn--cta:focus-visible{outline:2px solid var(--st-ink);outline-offset:3px}
main .btn--cta[aria-busy="true"]{cursor:progress;opacity:.7}

.kd-link{color:var(--st-ink);text-decoration:none;background:linear-gradient(var(--st-gold),var(--st-gold)) 0 100%/100% 1px no-repeat;padding-bottom:2px;font:500 var(--t-sm)/var(--lh-ui) var(--font-ui);transition:color 300ms var(--st-ease)}
.kd-link::after{content:"";display:inline-block;width:.55em;height:.55em;margin-left:.5em;border-top:1.2px solid currentColor;border-right:1.2px solid currentColor;rotate:45deg;translate:0 -.08em;transition:transform 500ms var(--st-ease)}
.kd-link:hover{color:var(--st-gold-ink)}
.kd-link:hover::after{transform:translate(2px,-2px)}
.kd-link:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:4px}

/* The diadem: a gold hairline with small leaves meeting at a rosette (symbol #kd-laurel, drawn inline per page). */
.kd-sprite{position:absolute;width:0;height:0;overflow:hidden}
.kd-laurel{display:block;width:240px;max-width:100%;height:24px;margin:0 0 var(--s-8);overflow:visible}
.kd-laurel__band,.kd-laurel__leaf,.kd-laurel__rose{fill:none;stroke:var(--st-gold);stroke-width:1;vector-effect:non-scaling-stroke}
.kd-laurel__leaf{fill:var(--st-gold-soft)}
.kd-laurel__dot{fill:var(--st-gold)}

/* ---------- Page head: the home hero's type on paper, then one full-bleed plate ---------- */
.st-head{position:relative;padding:clamp(64px,9vw,136px) 0 clamp(40px,5vw,72px);text-align:center;background:var(--st-paper)}
.st-head__in{display:flex;flex-direction:column;align-items:center}
.st-head__title{max-width:13em;min-width:0;margin:0;font:500 clamp(2.75rem,1.6rem + 4vw,5.25rem)/.98 var(--mk-serif);letter-spacing:-.022em;color:var(--st-ink);text-wrap:balance;overflow-wrap:break-word}
.st-head__lede{max-width:34rem;margin:clamp(20px,2.6vw,30px) 0 0;font:400 clamp(1.0625rem,1rem + .3vw,1.1875rem)/1.6 var(--font-ui);color:var(--st-ink-2);text-wrap:balance}
.st-head__cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:clamp(28px,3.6vw,40px) 0 0}
.st-head__meta{margin:20px 0 0;font:500 var(--t-xs)/var(--lh-ui) var(--font-ui);color:var(--st-muted)}
.st-head__meta a{color:inherit}
.st-head__in > ul{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:20px 0 0;padding:0;list-style:none}
.st-head .kd-laurel{margin:0 auto clamp(24px,3vw,36px)}

.st-plate-wide{position:relative;margin:0;background:var(--st-cloud);overflow:hidden}
.st-plate-wide__frame{position:relative;aspect-ratio:21/9;max-height:78svh;overflow:hidden}
.st-plate-wide__frame picture,.st-plate-wide__frame img{display:block;width:100%;height:100%}
.st-plate-wide__frame img{object-fit:cover;object-position:var(--px,50%) var(--py,50%)}
.st-plate-wide figcaption{max-width:var(--wrap);margin:0 auto;padding:14px var(--gutter) 0;font:400 var(--t-sm)/1.5 var(--font-ui);color:var(--st-muted);background:var(--st-paper)}
@media (max-width:799px){.st-plate-wide__frame{aspect-ratio:4/3}}

/* ---------- Chapters: a plate beside a short text column, alternating sides ---------- */
.st-ch{position:relative;padding:var(--st-pad) 0}
.st-ch + .st-ch{padding-top:calc(var(--st-pad) * .6)}
.st-ch--cloud{background:var(--st-cloud)}
.st-ch__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--st-gap);align-items:center}
.st-plate{grid-column:1 / span 7;margin:0 0 0 calc(-1 * var(--gutter));min-width:0}
.st-ch__text{grid-column:9 / span 4;min-width:0}
.st-ch--rev .st-plate{grid-column:7 / span 6;grid-row:1;margin:0 calc(-1 * var(--gutter)) 0 0}
.st-ch--rev .st-ch__text{grid-column:1 / span 5;grid-row:1}
.st-plate__frame{position:relative;overflow:hidden;aspect-ratio:4/3;background:var(--st-cloud)}
.st-plate--tall .st-plate__frame{aspect-ratio:4/5}
.st-plate__frame picture{display:block;width:100%;height:100%}
.st-plate__frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--px,50%) var(--py,50%)}
.st-plate figcaption{margin:16px 0 0;padding-left:var(--gutter);font:400 var(--t-sm)/1.5 var(--font-ui);color:var(--st-muted)}
.st-ch--rev .st-plate figcaption{padding:0 var(--gutter) 0 0;text-align:right}
.st-ch__text h2,.st-band__head h2{max-width:11ch;min-width:0;margin:0 0 28px;font:500 clamp(2.5rem,1.5rem + 3vw,4.5rem)/1 var(--mk-serif);letter-spacing:-.022em;color:var(--st-ink);text-wrap:balance;overflow-wrap:break-word}
.st-ch__text p,.st-band__body > p{max-width:30em;margin:0 0 20px;font:400 1.0625rem/1.7 var(--font-ui);color:var(--st-ink-2);text-wrap:pretty}
.st-ch__text p:last-child,.st-band__body > p:last-child{margin-bottom:0}
.st-ch__aside{margin-top:28px!important;padding-top:20px;border-top:1px solid var(--st-gold-soft);font-size:var(--t-sm)!important;line-height:1.6!important;color:var(--st-muted)!important}
.st-ch__lead{font:italic 400 clamp(1.5rem,1.2rem + 1vw,2rem)/1.2 var(--mk-serif)!important;letter-spacing:-.01em;color:var(--st-ink)!important}

/* ---------- Bands: a heading on the left, reading text on the right; no picture ---------- */
.st-band{position:relative;padding:var(--st-pad) 0;scroll-margin-top:var(--nav-h)}
.st-band + .st-band{padding-top:0}
.st-band--cloud,.st-band--cloud + .st-band{padding-top:var(--st-pad)}
.st-band--cloud{background:var(--st-cloud)}
.st-band__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--st-gap);row-gap:28px;align-items:start}
.st-band__head{grid-column:1 / span 5;min-width:0}
.st-band__head h2{max-width:12ch;margin:0}
.st-band__head p{max-width:24em;margin:20px 0 0;font:italic 400 clamp(1.25rem,1.1rem + .6vw,1.625rem)/1.3 var(--mk-serif);color:var(--st-gold-ink);text-wrap:balance}
.st-band__body{grid-column:7 / span 6;min-width:0}
.st-band__body h3{margin:32px 0 10px;font:600 var(--t-lg)/1.35 var(--font-ui);letter-spacing:0;color:var(--st-ink)}
.st-band__body h3:first-child{margin-top:0}
.st-band__body ul,.st-band__body ol{max-width:34em;margin:0 0 20px;padding-left:1.25em;color:var(--st-ink-2)}
.st-band__body li{margin:0 0 8px;line-height:1.65}
.st-band__body .actions{margin-top:28px}

/* Ruled rows: a short name and its plain line, separated by hairlines with a gold tick. */
.st-rows{width:100%;margin:0;padding:0;list-style:none;border-bottom:1px solid var(--st-rule)}
.st-rows > li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px 12px;padding:18px 0;border-top:1px solid var(--st-rule)}
.st-rows > li::before{content:"";grid-row:1 / span 2;width:18px;height:1px;margin-top:.85em;background:var(--st-gold)}
.st-rows h3,.st-rows b{grid-column:2;margin:0;font:600 var(--t-md)/1.5 var(--font-ui);color:var(--st-ink)}
.st-rows p{grid-column:2;margin:0;font:400 var(--t-md)/1.65 var(--font-ui);color:var(--st-ink-2)}
.st-rows--numbered{counter-reset:row}
.st-rows--numbered > li{counter-increment:row}
.st-rows--numbered > li::before{content:counter(row);width:auto;height:auto;margin-top:0;background:none;font:500 1.375rem/1.1 var(--mk-serif);color:var(--st-gold-ink)}

/* ---------- Night: the one dark chapter. A lamp on a sill, the village asleep beyond it. ---------- */
.st-night{position:relative;isolation:isolate;display:flex;align-items:center;min-height:min(92svh,1000px);padding:clamp(64px,7vw,120px) 0;overflow:hidden;background:var(--st-night);color:var(--st-on-night)}
.st-night__media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.st-night__media > *{position:absolute;inset:0;display:block;width:100%;height:100%}
.st-night__media img{width:100%;height:100%;object-fit:cover;object-position:var(--px,40%) var(--py,60%)}
.st-night::before{content:"";position:absolute;inset:0 0 0 auto;width:58%;z-index:-1;background:linear-gradient(270deg,rgba(9,11,20,.78) 0%,rgba(9,11,20,.5) 55%,rgba(9,11,20,0) 100%)}
.st-night__text{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--st-gap)}
.st-night__text > *{grid-column:8 / span 5}
.st-night__text h2{max-width:12ch;min-width:0;margin:0 0 28px;font:500 clamp(2.5rem,1.5rem + 3vw,4.5rem)/1 var(--mk-serif);letter-spacing:-.022em;color:var(--st-on-night);text-wrap:balance;overflow-wrap:break-word}
.st-night__text p{max-width:28em;margin:0 0 16px;font:400 1.0625rem/1.7 var(--font-ui);color:var(--st-on-night-2);text-wrap:pretty}
.st-night__text p:last-child{margin-bottom:0}

/* ---------- Close: what Kodros does today, then the ways forward ---------- */
.mk-close{position:relative;padding:var(--st-pad) 0;background:var(--st-paper);color:var(--st-ink)}
.mk-close--cloud{background:var(--st-cloud)}
.mk-close__in{display:flex;flex-direction:column;align-items:center;text-align:center}
.st-crown{width:min(100%,720px);margin:0 0 clamp(40px,5vw,64px)}
.st-crown__frame{position:relative;overflow:hidden;aspect-ratio:3/2;background:var(--st-cloud)}
.st-crown__frame picture,.st-crown__frame img{display:block;width:100%;height:100%;object-fit:cover}
.mk-close h2{max-width:14em;min-width:0;margin:0;font:500 clamp(2.5rem,1.4rem + 3.6vw,4.4rem)/1 var(--mk-serif);letter-spacing:-.02em;color:var(--st-ink);text-wrap:balance;overflow-wrap:break-word}
.mk-close__line{max-width:32rem;margin:24px 0 0;font:400 var(--t-md)/1.7 var(--font-ui);color:var(--st-ink-2)}
.st-today{width:100%;max-width:40rem;margin:clamp(36px,4vw,56px) 0 0;padding:0;list-style:none;text-align:left;border-bottom:1px solid var(--st-rule)}
.st-today li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;padding:16px 0;border-top:1px solid var(--st-rule);font:400 var(--t-md)/1.6 var(--font-ui);color:var(--st-ink-2)}
.st-today li::before{content:"";width:18px;height:1px;margin-top:.8em;background:var(--st-gold)}
.st-close__cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:clamp(36px,4vw,52px) 0 0}
.kd-close__alt{margin:24px 0 0}

/* ---------- Questions: the shared FAQ, set in the story's type ---------- */
.st-faq{max-width:46rem;margin:0;border-top:1px solid var(--st-rule)}
.st-faq details{border-bottom:1px solid var(--st-rule)}
.st-faq summary{position:relative;display:block;padding:22px 48px 22px 0;font:500 clamp(1.25rem,1.1rem + .5vw,1.5rem)/1.3 var(--mk-serif);color:var(--st-ink);cursor:pointer;list-style:none}
.st-faq summary::-webkit-details-marker{display:none}
.st-faq summary::before,.st-faq summary::after{content:"";position:absolute;right:8px;top:50%;width:14px;height:1.2px;background:var(--st-gold);transition:rotate 300ms var(--st-ease)}
.st-faq summary::after{rotate:90deg}
.st-faq details[open] summary::after{rotate:0deg}
.st-faq summary:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.st-faq details > div{padding:0 0 22px;max-width:40em}
.st-faq details > div p{margin:0 0 12px;font:400 var(--t-md)/1.7 var(--font-ui);color:var(--st-ink-2)}

/* ---------- Reading: legal text and posts, a quiet rail beside one column ---------- */
.st-read{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start;padding:clamp(48px,6vw,96px) 0 var(--st-pad)}
.st-read > nav{position:sticky;top:calc(var(--nav-h) + 24px);align-self:start;min-width:0}
.st-read__rail{margin:0;padding:0;list-style:none;border-left:1px solid var(--st-gold-soft)}
.st-read__rail a{display:flex;align-items:center;min-height:36px;padding:0 0 0 16px;font:500 var(--t-sm)/1.35 var(--font-ui);color:var(--st-muted);text-decoration:none}
.st-read__rail a:hover{color:var(--st-ink)}
.st-read__rail a:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:4px}
.st-read__body{min-width:0;max-width:44rem;font:400 1.0625rem/1.75 var(--font-ui);color:var(--st-ink-2)}
.st-read__body > h2,.st-read__body section > h2{margin:56px 0 16px;padding-top:32px;border-top:1px solid var(--st-rule);font:500 clamp(1.875rem,1.4rem + 1.4vw,2.625rem)/1.08 var(--mk-serif);letter-spacing:-.018em;color:var(--st-ink);scroll-margin-top:calc(var(--nav-h) + 24px)}
.st-read__body > h2:first-child,.st-read__body > section:first-child > h2:first-child{margin-top:0;padding-top:0;border-top:0}
.st-read__body h3{margin:32px 0 10px;font:600 var(--t-lg)/1.35 var(--font-ui);color:var(--st-ink);scroll-margin-top:calc(var(--nav-h) + 24px)}
.st-read__body p,.st-read__body li{line-height:1.75}
.st-read__body ul,.st-read__body ol{padding-left:1.3em}
.st-read__body li + li{margin-top:6px}
.st-read__body a{color:var(--st-ink);text-decoration-color:var(--st-gold);text-underline-offset:.22em}
.st-read__part{scroll-margin-top:var(--nav-h)}
.st-read__part + .st-read__part{margin-top:clamp(72px,8vw,120px);padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--st-gold-soft)}
.st-read__part > .st-read__kicker{margin:0 0 12px;font:600 var(--t-2xs)/16px var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--st-gold-ink)}
.st-read__part > h2.st-read__title{margin:0 0 20px;padding:0;border:0;font:500 clamp(2.25rem,1.5rem + 2.4vw,3.5rem)/1 var(--mk-serif);letter-spacing:-.02em;color:var(--st-ink)}
.st-read__body table{width:100%;margin:24px 0;border-collapse:collapse;font-size:var(--t-sm);line-height:1.5}
.st-read__body th{padding:10px 12px;border-bottom:1px solid var(--mk-line-strong);font:600 var(--t-xs)/1.3 var(--font-ui);text-align:left;color:var(--st-ink)}
.st-read__body td{padding:10px 12px;border-bottom:1px solid var(--st-rule);vertical-align:top}
@media (max-width:959px){
  .st-read{grid-template-columns:minmax(0,1fr)}
  .st-read > nav{position:static}
  .st-read__rail{display:flex;flex-wrap:wrap;gap:4px 16px;border-left:0;border-top:1px solid var(--st-gold-soft);padding-top:12px}
  .st-read__rail a{padding:0;min-height:44px}
}

/* ---------- Forms in the story's type (the contact and sizing request) ---------- */
.st-form{display:grid;gap:18px;width:100%;max-width:40rem;margin:0;text-align:left}
.st-form .field{margin:0}
.st-form .field label{font:600 var(--t-sm)/var(--lh-ui) var(--font-ui);color:var(--st-ink)}
.st-form .field input:not([type="checkbox"]):not([type="radio"]),.st-form .field textarea,.st-form .field select{border:1px solid var(--mk-line-strong);border-radius:12px;background:var(--st-card);min-height:52px}
.st-form .field input:focus-visible,.st-form .field textarea:focus-visible,.st-form .field select:focus-visible{border-color:var(--st-gold)}
.st-form__row{display:grid;gap:18px}
@media (min-width:720px){.st-form__row--2{grid-template-columns:1fr 1fr}}
.st-form .actions{margin:6px 0 0}

/* ---------- Tablet and phone: one column, plates edge to edge, text under its picture ---------- */
@media (max-width:899px){
  .st-ch__grid,.st-band__grid{grid-template-columns:minmax(0,1fr)}
  .st-plate,.st-ch--rev .st-plate{grid-column:1;grid-row:auto;margin:0 calc(-1 * var(--gutter))}
  .st-ch__text,.st-ch--rev .st-ch__text{grid-column:1;grid-row:auto;margin-top:clamp(32px,7vw,48px)}
  .st-plate figcaption,.st-ch--rev .st-plate figcaption{padding:0 var(--gutter);text-align:left}
  .st-band__head,.st-band__body{grid-column:1}
  .st-night{display:block;min-height:0;padding:0 0 clamp(56px,12vw,88px)}
  .st-night::before{display:none}
  .st-night__media{position:relative;inset:auto;z-index:0;aspect-ratio:4/3}
  .st-night__text{display:block;margin-top:clamp(36px,8vw,52px)}
}

/* ---------- Motion: one reveal per section, plates lifting like a curtain, a slow settle on page plates ---------- */
@media (prefers-reduced-motion:no-preference){
  @keyframes st-rise{from{opacity:0;transform:translateY(var(--mk-rise))}to{opacity:1;transform:none}}
  @keyframes st-settle{from{opacity:0;transform:scale(1.035)}to{opacity:1;transform:none}}
  .st-head__in > *{animation:st-rise 1100ms var(--st-ease) .1s both}
  .st-head__in > :nth-child(2){animation-delay:.2s}
  .st-head__in > :nth-child(3){animation-delay:.3s}
  .st-head__in > :nth-child(n+4){animation-delay:.4s}
  .st-plate-wide__frame img{animation:st-settle 2200ms var(--st-ease) .1s both}

  /* Reveal once (site.js adds .is-in). Hidden only under html.js, so the page is whole without script. */
  .js [data-reveal]:not(.is-in) :is(.st-ch__text > *,.st-band__head > *,.st-band__body > *,.st-night__text > *,.mk-close__in > *,figcaption){opacity:0;transform:translateY(22px)}
  .js [data-reveal] :is(.st-ch__text > *,.st-band__head > *,.st-band__body > *,.st-night__text > *,.mk-close__in > *,figcaption){transition:opacity 1100ms var(--st-ease),transform 1100ms var(--st-ease)}
  .js [data-reveal] :is(.st-ch__text,.st-band__body,.st-night__text,.mk-close__in) > :nth-child(2){transition-delay:.12s}
  .js [data-reveal] :is(.st-ch__text,.st-band__body,.st-night__text,.mk-close__in) > :nth-child(3){transition-delay:.22s}
  .js [data-reveal] :is(.st-ch__text,.st-band__body,.st-night__text,.mk-close__in) > :nth-child(n+4){transition-delay:.3s}
  .js [data-reveal] figcaption{transition-delay:.5s}
  .js [data-reveal]:not(.is-in) :is(.st-plate__frame,.st-crown__frame){clip-path:inset(14% 0 0 0)}
  .js [data-reveal] :is(.st-plate__frame,.st-crown__frame){transition:clip-path 1600ms var(--st-ease)}
  .js [data-reveal]:not(.is-in) .kd-laurel__band{stroke-dasharray:212;stroke-dashoffset:212}
  .js [data-reveal] .kd-laurel__band{transition:stroke-dashoffset 1600ms var(--st-ease) .2s}

  /* Parallax: home.js writes --st-y on [data-parallax] while it is on screen; the picture drifts inside its frame. */
  .st-par [data-parallax] > picture{transform:translate3d(0,var(--st-y,0px),0) scale(1.1);transform-origin:50% 50%}
}

/* Contact: the public address with a copy control, under the page head. */
.contact-mail{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 12px}
.contact-copy{min-height:36px;padding:0 14px;border:1px solid var(--mk-line-strong);border-radius:999px;background:var(--st-card);color:var(--st-ink);font:500 var(--t-xs)/1 var(--font-ui);cursor:pointer}
.contact-copy:hover{border-color:var(--st-gold)}
.contact-copy:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.st-offers{margin-top:40px}
.st-offers .shelf{margin:0}
.st-offers .offer{border:1px solid var(--st-rule);background:var(--st-card)}