/* ---------- 1. reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:hidden}
body{margin:0;overflow-x:hidden;max-width:100%}
img,svg,video{display:block;max-width:100%;height:auto}
h1,h2,h3,h4,p,figure{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
input,select,textarea,button{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit}

/* ---------- 2. tokens ---------- */
:root{
  --page:#FBF6EF;
  --card:#FFFFFF;
  --ink:#14110E;
  --dim:#5F594F;
  --rule:#14110E;
  --mat:#14110E;
  --on-mat:#FFFFFF;
  --t-h1:clamp(2.35rem,6.2vw,4.8rem);
  --t-h2:clamp(1.5rem,3vw,2.3rem);
  --t-no:clamp(2.2rem,5.4vw,3.4rem);
  --t-open:clamp(1.12rem,1.7vw,1.42rem);
  --t-body:1.07rem;
  --t-mini:.71rem;
  --pad:clamp(18px,4.4vw,56px);
  --air:clamp(46px,6.4vw,92px);
  --max:1280px;
}
/* ЦВЕТ ПРИНАДЛЕЖИТ МАТЕРИАЛУ. Восемь классов, больше цветовых тем на сайте нет. */
.mat-brick{--mat:#E0301C;--on-mat:#FFFFFF}
.mat-timber{--mat:#F28C00;--on-mat:#14110E}
.mat-salt{--mat:#C7B500;--on-mat:#14110E}
.mat-stone{--mat:#4E9A2F;--on-mat:#FFFFFF}
.mat-ice{--mat:#00A6A0;--on-mat:#14110E}
.mat-glass{--mat:#0072E5;--on-mat:#FFFFFF}
.mat-steel{--mat:#6C3CE0;--on-mat:#FFFFFF}
.mat-concrete{--mat:#C4197A;--on-mat:#FFFFFF}

/* ---------- 3. base ---------- */
body{
  background:var(--page);
  color:var(--ink);
  font-family:"Newsreader",Georgia,"Times New Roman",serif;
  font-size:var(--t-body);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
h1,h2{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:800;line-height:1.04;letter-spacing:-.015em;overflow-wrap:anywhere}
h1{font-size:var(--t-h1)}
h2{font-size:var(--t-h2)}
p{max-width:62ch}

/* ---------- 4. каркас ---------- */
.gf-hold{width:100%;max-width:var(--max);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad);min-width:0}
.gf-air{padding-top:var(--air);padding-bottom:var(--air)}

/* ---------- 5. ПОЛОСА МАТЕРИАЛОВ И ЧИПЫ ---------- */
.gf-strip{display:flex;height:16px}
.gf-strip i{display:block;flex:1 1 0;min-width:0;background:var(--mat)}
.gf-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px;min-width:0}
.gf-chip{background:var(--mat);color:var(--on-mat);padding:5px 11px;font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:700;font-size:var(--t-mini);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;display:inline-block}

/* ---------- 6. ЗАПИСЬ ОТЕЛЯ ---------- */
.gf-entry{background:var(--card);border:2px solid var(--ink);margin-top:clamp(26px,3.4vw,46px);min-width:0}
.gf-body{padding:clamp(20px,3vw,42px)}
.gf-no{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:800;font-size:var(--t-no);line-height:1}
.gf-where{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-size:var(--t-mini);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:6px;overflow-wrap:anywhere}
.gf-entry h2{margin-top:10px}
.gf-fig{margin-top:26px;max-width:560px}
.gf-shot{overflow:hidden;background:var(--page);aspect-ratio:16/10}
.gf-shot img{width:100%;height:100%;object-fit:cover}
.gf-fig figcaption{margin-top:8px;font-size:var(--t-mini);color:var(--dim)}
.gf-lab{display:block;font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:700;font-size:var(--t-mini);letter-spacing:.22em;text-transform:uppercase;border-bottom:3px solid var(--rule);padding-bottom:5px}
.gf-part{margin-top:26px}
.gf-part p{margin-top:10px}
.gf-two{display:grid;gap:26px 34px;grid-template-columns:minmax(0,1fr);margin-top:26px}
@media (min-width:1000px){.gf-two{grid-template-columns:repeat(2,minmax(0,1fr))}}
.gf-two p{max-width:46ch}
.gf-plan{margin-top:28px;background:var(--ink);color:var(--page);padding:15px 18px;max-width:62ch}
.gf-plan b{display:block;font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-size:var(--t-mini);letter-spacing:.22em;text-transform:uppercase;margin-bottom:5px;opacity:.75}
.gf-file{margin-top:20px;font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-size:var(--t-mini);letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}

/* ---------- 7. списки, ключ материалов ---------- */
.gf-key{display:grid;gap:2px;grid-template-columns:minmax(0,1fr);margin-top:26px}
@media (min-width:480px){.gf-key{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:620px){.gf-key{grid-template-columns:repeat(4,minmax(0,1fr))}}
.gf-key a{background:var(--mat);color:var(--on-mat);padding:18px;text-decoration:none;display:block;min-width:0;overflow-wrap:anywhere}
.gf-key b{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:800;font-size:clamp(.95rem,3.8vw,1.15rem);letter-spacing:.06em;text-transform:uppercase;display:block}
.gf-key span{display:block;margin-top:7px;font-size:.9rem;opacity:.9}
.gf-rows li{display:grid;gap:6px 18px;grid-template-columns:minmax(0,1fr);padding:15px 0;border-bottom:2px solid var(--rule)}
@media (min-width:1000px){.gf-rows li{grid-template-columns:2.6rem minmax(0,17rem) 92px minmax(0,1fr);align-items:center}}
.gf-rows a{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:700;text-decoration:none;border-bottom:3px solid var(--ink)}
.gf-rows span{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-size:var(--t-mini);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.gf-mini{display:flex;height:10px;width:92px}
.gf-mini i{display:block;flex:1 1 0;min-width:0;background:var(--mat)}

/* ---------- 8. шапка с бургером ---------- */
.gf-top{background:var(--card);border-bottom:3px solid var(--ink);padding:13px var(--pad);display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;min-width:0}
.gf-logo{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:800;font-size:clamp(1.05rem,4.6vw,1.28rem);text-decoration:none;margin-right:auto;letter-spacing:-.01em;min-width:0}
.gf-burger{display:none;border:2px solid var(--ink);padding:6px 13px;font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:700;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;flex:0 0 auto}
.gf-nav{display:flex;flex-wrap:wrap;gap:9px 18px;width:100%}
.gf-nav a{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:700;text-decoration:none;font-size:.92rem}
.gf-nav a[aria-current="page"]{background:var(--ink);color:var(--card);padding:2px 8px}
.gf-js .gf-burger{display:block}
.gf-js .gf-nav{display:none}
.gf-js .gf-nav.is-open{display:flex;flex-direction:column;gap:12px}
@media (min-width:900px){
  .gf-nav{width:auto;flex-wrap:nowrap}
  .gf-js .gf-nav{display:flex;flex-direction:row}
  .gf-js .gf-burger{display:none}
}

/* ---------- 9. служебное ---------- */
.gf-lede{font-size:1.2rem;color:var(--dim);max-width:58ch}
.gf-link{text-decoration:none;border-bottom:3px solid var(--ink)}
.gf-note{border-top:3px solid var(--ink);margin-top:var(--air);padding-top:18px;font-size:.95rem;color:var(--dim);max-width:70ch}
.gf-foot{background:var(--card);border-top:3px solid var(--ink);padding:26px var(--pad)}
.gf-foot-in{width:100%;max-width:var(--max);margin:0 auto;display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
@media (min-width:620px){.gf-foot-in{grid-template-columns:minmax(0,3fr) minmax(0,1fr)}}
.gf-foot p{font-size:.92rem;color:var(--dim);max-width:58ch}
.gf-foot a{text-decoration:none}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---------- 10. дополнения ---------- */
.gf-h1top{max-width:20ch}
.gf-count{display:inline-block;font-size:var(--t-h2);vertical-align:middle;border:3px solid var(--ink);padding:0 12px;margin-left:8px;white-space:nowrap}
.gf-lede{margin-top:20px}
.gf-intro{margin-top:18px;font-size:var(--t-open);line-height:1.5}
.gf-age{margin-top:18px;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);padding:12px 0;font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:700;font-size:.92rem;max-width:70ch}
.gf-lab-chips{margin-top:26px}
.gf-help{background:var(--ink);color:var(--page);padding:22px 0}
.gf-help p{max-width:70ch;font-size:.95rem}
.gf-fnav li{margin-top:6px}
.gf-fnav a{border-bottom:3px solid var(--ink)}
.gf-matblock{margin-top:var(--air);background:var(--card);border:2px solid var(--ink);padding:0 0 clamp(20px,3vw,34px)}
.gf-band{height:26px;background:var(--mat)}
.gf-matblock h2{margin-top:22px;padding:0 clamp(18px,3vw,34px)}
.gf-matline{margin-top:10px;padding:0 clamp(18px,3vw,34px)}
.gf-matblock .gf-file{padding:0 clamp(18px,3vw,34px)}
.gf-matblock p{max-width:70ch}
.gf-matlist{margin-top:14px;padding:0 clamp(18px,3vw,34px)}
.gf-matlist li{padding:11px 0;border-bottom:2px solid var(--rule)}
.gf-matlist span{font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-size:var(--t-mini);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.gf-form{display:grid;gap:18px;max-width:44rem;margin-top:30px}
.gf-field label{display:block;font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:700;font-size:var(--t-mini);letter-spacing:.22em;text-transform:uppercase;margin-bottom:7px}
.gf-field input,.gf-field select,.gf-field textarea{width:100%;background:var(--card);border:2px solid var(--ink);padding:11px 13px}
.gf-inline{display:flex;gap:11px;align-items:flex-start;max-width:44rem}
.gf-inline input{width:20px;height:20px;margin-top:6px;flex:0 0 auto}
.gf-inline label{font-size:.95rem}
.gf-send{background:var(--ink);color:var(--page);border:2px solid var(--ink);padding:11px 26px;font-family:"Syne","Trebuchet MS",Arial,sans-serif;font-weight:700;font-size:.85rem;letter-spacing:.18em;text-transform:uppercase}
@media (min-width:1280px){.gf-h1top{max-width:24ch}}

/* ---------- 11. page openings — a different composition on every page ---------- */
.gf-open{margin-bottom:var(--air);min-width:0;max-width:100%}
.gf-open h1{max-width:20ch;overflow-wrap:anywhere}
.gf-open .gf-lede{margin-top:16px}
.gf-open .gf-intro{margin-top:16px}
.gf-open-kicker{
  font-family:"Syne","Trebuchet MS",Arial,sans-serif;
  font-weight:700;
  font-size:var(--t-mini);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--dim);
  margin-bottom:10px;
  overflow-wrap:anywhere;
}
@media (max-width:520px){
  .gf-open h1{max-width:none;font-size:clamp(1.35rem,7.4vw,2.1rem)}
  .gf-count{font-size:1.15rem;padding:0 8px;margin-left:6px}
  .gf-open--capsule h1,
  .gf-open--casino h1{font-size:clamp(1.4rem,7vw,2rem)}
}
.gf-open--art h1,
.gf-open--capsule h1,
.gf-open--casino h1,
.gf-open--ice h1,
.gf-open--materials h1,
.gf-open--method h1,
.gf-open--contact h1,
.gf-open--privacy h1,
.gf-open--terms h1{max-width:none}
@media (min-width:521px){
  .gf-open--capsule h1,
  .gf-open--casino h1{font-size:clamp(1.7rem,4.2vw,3.5rem)}
}

.gf-open-fig{margin:0;min-height:0}
.gf-open-frame{overflow:hidden;background:var(--card);border:2px solid var(--ink)}
.gf-open-frame img{width:100%;height:100%;object-fit:cover;display:block;max-width:100%}

/* home: colour rail, title, square plaque */
.gf-open--home{display:grid;gap:22px}
.gf-open--home .gf-open-key{display:flex;height:28px;border:2px solid var(--ink)}
.gf-open--home .gf-open-key i{display:block;flex:1 1 0;min-width:0;background:var(--mat)}
.gf-open--home .gf-open-frame{aspect-ratio:1/1}
@media (min-width:900px){
  .gf-open--home{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);grid-template-rows:auto auto;gap:28px 42px;align-items:end}
  .gf-open--home .gf-open-key{grid-column:1/-1;height:36px}
  .gf-open--home .gf-open-copy{grid-column:1}
  .gf-open--home .gf-open-fig{grid-column:2;grid-row:2}
}

/* art: portrait photograph beside the title */
.gf-open--art{display:grid;gap:26px}
.gf-open--art .gf-open-copy{order:1}
.gf-open--art .gf-open-fig{order:2}
.gf-open--art .gf-open-frame{aspect-ratio:4/5;min-height:220px;max-height:min(68vh,560px)}
@media (min-width:900px){
  .gf-open--art{grid-template-columns:minmax(0,.38fr) minmax(0,1fr);gap:42px;align-items:stretch}
  .gf-open--art .gf-open-fig{order:1;height:100%}
  .gf-open--art .gf-open-frame{height:100%;max-height:none;aspect-ratio:auto;min-height:min(68vh,560px)}
  .gf-open--art .gf-open-copy{order:2;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:6px}
}

/* capsule: two dark modular cells, photograph in the unit */
.gf-open--capsule{display:grid;gap:2px;background:var(--ink);border:2px solid var(--ink)}
.gf-open--capsule .gf-open-copy{background:var(--ink);color:var(--page);padding:clamp(22px,4.2vw,44px)}
.gf-open--capsule .gf-open-kicker{color:rgba(251,246,239,.62)}
.gf-open--capsule .gf-intro{color:rgba(251,246,239,.88)}
.gf-open--capsule .gf-count{border-color:var(--page);color:var(--page)}
.gf-open--capsule .gf-open-frame{border:0;min-height:220px;aspect-ratio:5/4}
@media (min-width:800px){
  .gf-open--capsule{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:stretch}
  .gf-open--capsule .gf-open-copy{display:flex;flex-direction:column;justify-content:flex-end}
  .gf-open--capsule .gf-open-fig,
  .gf-open--capsule .gf-open-frame{height:100%;min-height:100%;aspect-ratio:auto}
}

/* casino: dark slab with the plaque photograph */
.gf-open--casino{background:var(--ink);color:var(--page);padding:clamp(26px,5vw,56px);border:2px solid var(--ink);margin-bottom:0}
.gf-open--casino .gf-open-kicker{color:rgba(251,246,239,.62)}
.gf-open--casino .gf-intro{color:rgba(251,246,239,.9)}
.gf-open--casino .gf-count{border-color:var(--page);color:var(--page)}
.gf-open--casino .gf-open-rule{display:flex;height:10px;margin:22px 0 26px;max-width:22rem}
.gf-open--casino .gf-open-rule i{display:block;flex:1 1 0;min-width:0;background:var(--mat)}
.gf-open--casino .gf-open-fig{margin-top:28px;max-width:22rem}
.gf-open--casino .gf-open-frame{aspect-ratio:1/1;border-color:var(--page)}

/* ice: teal field, photograph offset like a packed block */
.gf-open--ice{background:#00A6A0;color:var(--ink);padding:clamp(26px,5vw,56px);border:2px solid var(--ink)}
.gf-open--ice .gf-open-kicker{color:var(--ink)}
.gf-open--ice .gf-open-copy{max-width:42rem}
.gf-open--ice .gf-open-fig{
  margin-top:28px;
  margin-left:clamp(12px,6vw,48px);
  width:calc(100% - clamp(12px,6vw,48px) - 12px);
}
.gf-open--ice .gf-open-frame{aspect-ratio:16/7;box-shadow:12px 12px 0 var(--ink)}

/* materials: eight named colour slabs as the opening */
.gf-open--materials .gf-open-slabs{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2px;
  margin-top:26px;
  background:var(--ink);
  border:2px solid var(--ink);
}
.gf-open--materials .gf-open-slabs a{
  background:var(--mat);
  color:var(--on-mat);
  padding:clamp(18px,3vw,28px) 14px;
  text-decoration:none;
  font-family:"Syne","Trebuchet MS",Arial,sans-serif;
  font-weight:800;
  font-size:var(--t-mini);
  letter-spacing:.16em;
  text-transform:uppercase;
  display:flex;
  align-items:flex-end;
  min-height:5.4rem;
  min-width:0;
  overflow-wrap:anywhere;
}
@media (min-width:720px){
  .gf-open--materials .gf-open-slabs{grid-template-columns:repeat(4,minmax(0,1fr))}
  .gf-open--materials .gf-open-slabs a{min-height:7.2rem}
}

/* method: ruled quote board */
.gf-open--method{border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);padding:clamp(28px,5vw,56px) 0}
.gf-open--method .gf-open-quote{
  margin-top:22px;
  font-family:"Syne","Trebuchet MS",Arial,sans-serif;
  font-weight:800;
  font-size:clamp(1.55rem,4.2vw,3.05rem);
  line-height:1.1;
  letter-spacing:-.02em;
  max-width:16ch;
}
.gf-open--method .gf-lede{max-width:46ch}

/* contact: inset card with a thick left bar */
.gf-open--contact{background:var(--card);border:2px solid var(--ink);border-left-width:18px;padding:clamp(22px,4vw,40px)}

/* privacy: docket lines, date in the opening */
.gf-open--privacy{border-top:8px solid var(--ink);border-bottom:3px solid var(--ink);padding:22px 0 18px}
.gf-open--privacy .gf-file{margin-top:14px}

/* terms: stacked rules like a legal heading */
.gf-open--terms{padding:6px 0 22px;border-bottom:3px solid var(--ink);box-shadow:inset 0 3px 0 var(--ink)}
.gf-open--terms .gf-open-kicker{margin-top:14px}