/* =========================================================
   Fiplast — Barin Plast Co.  ·  "Veneer" redesign
   Persian RTL, no build step.
   Photos are used as full-bleed backgrounds, not framed pictures.
   Palette is sampled from them: warm grey backdrop, walnut ink,
   oak and ash veneers, ebony.
   ========================================================= */

@font-face{font-family:"Vazirmatn";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("fonts/vazirmatn-var.woff2") format("woff2")}

/* ---------- Tokens ---------- */
:root,
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#E2DDD6;          /* studio backdrop */
  --surface:#EEEAE4;     /* lifted panels */
  --deep:#D3CCC2;        /* recessed band */
  --ink:#33241B;         /* walnut */
  --muted:#5F5146;
  --rule:rgba(51,36,27,.16);
  --oak:#C39A6B;
  --honey:#9A6332;       /* links, focus */
  --btn:#33241B;
  --btn-ink:#F3EEE7;
  --btn-hover:#4D3628;
  --shadow:0 30px 60px -32px rgba(51,36,27,.45);
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#1D1713;
  --surface:#29211B;
  --deep:#241D18;
  --ink:#EEE7DD;
  --muted:#B6A797;
  --rule:rgba(238,231,221,.14);
  --oak:#C9A06F;
  --honey:#D7AE7B;
  --btn:#C9A06F;
  --btn-ink:#1D1713;
  --btn-hover:#D9B585;
  --shadow:0 30px 60px -30px rgba(0,0,0,.7);
}
:root{
  /* Fixed colours for text that sits on photographs (independent of theme) */
  --walnut:#2E2018;
  --cream:#F4EEE6;
  --cream-muted:rgba(244,238,230,.78);
  --ebony:#241B16;

  --font:"Vazirmatn","Vazir",Tahoma,"Segoe UI",system-ui,sans-serif;
  --wrap:80rem;
  --gutter:clamp(1rem,4vw,2.5rem);
  --hd-h:4.75rem;
  --r-card:22px;
  --r-tile:20px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --ease-soft:cubic-bezier(.16,.84,.24,1);
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:6rem}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:1.0625rem;line-height:1.9;
  -webkit-font-smoothing:antialiased;transition:background-color .3s,color .3s}
img{max-width:100%;height:auto;display:block;-webkit-user-drag:none;user-drag:none}
body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
a{color:inherit}
p{margin:0}
h1,h2,h3{margin:0;font-weight:300;line-height:1.3;text-wrap:balance}
ul,ol,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
address{font-style:normal}
:focus-visible{outline:2px solid var(--honey);outline-offset:3px;border-radius:6px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip-link{position:absolute;inset-inline-start:1rem;top:-4rem;z-index:100;background:var(--btn);color:var(--btn-ink);padding:.6rem 1rem;border-radius:999px;text-decoration:none}
.skip-link:focus{top:1rem}
main:focus{outline:none}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.latin{font-feature-settings:normal}
[dir="ltr"]{unicode-bidi:isolate}

/* Type scale (Vazirmatn variable: thin display, sturdy small type) */
.display{font-size:clamp(2.4rem,5.4vw,4.8rem);font-weight:230;line-height:1.2}
.h2{font-size:clamp(1.85rem,3.4vw,2.85rem);font-weight:280;line-height:1.3}
h3,.h3{font-size:1.125rem;font-weight:650;line-height:1.6}
.lead{font-size:clamp(1.0625rem,1.4vw,1.1875rem);line-height:2;color:var(--muted);max-width:38em}
.muted{color:var(--muted)}
.prose{max-width:36em}
.prose p+p{margin-block-start:1em}
.text-link{color:var(--honey);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.45em;font-weight:550}
.text-link:hover{text-decoration-thickness:2px}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3.25rem;padding:.5rem 1.9rem;
  border-radius:999px;background:var(--btn);color:var(--btn-ink);font:inherit;font-weight:600;font-size:1rem;text-decoration:none;border:0;cursor:pointer;
  transition:background-color .2s,transform .2s var(--ease)}
.btn:hover{background:var(--btn-hover)}
.btn:active{transform:scale(.98)}
.btn--light{background:var(--cream);color:var(--walnut)}
.btn--light:hover{background:#fff}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem}
.phone-link{font-weight:550;text-decoration:none;border-block-end:1px solid currentColor;padding-block-end:2px}

/* ---------- Header ---------- */
.hd{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 84%,transparent);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);
  border-block-end:1px solid transparent;transition:border-color .3s,background-color .3s,color .3s}
.hd.is-stuck{border-block-end-color:var(--rule)}
.hd__bar{display:flex;align-items:center;gap:1.5rem;min-height:var(--hd-h)}
.brand{display:inline-flex;align-items:center;text-decoration:none;flex:none}
.brand__logo{display:block;height:52px;width:auto}
.brand__logo--dark,:root[data-theme="dark"] .brand__logo--light{display:none}
:root[data-theme="dark"] .brand__logo--dark{display:block}
.nav{margin-inline:auto}
.nav__list{display:flex;gap:.25rem}
.nav__list a{display:block;padding:.45rem 1rem;border-radius:999px;text-decoration:none;font-size:.95rem;font-weight:500;color:var(--muted);transition:color .2s,background-color .2s}
.nav__list a:hover{color:var(--ink)}
.nav__list a[aria-current="page"]{color:var(--ink);background:var(--surface)}
.hd__tools{display:flex;align-items:center;gap:.5rem}
.hd__phone{font-size:.95rem;font-weight:600;text-decoration:none;padding-inline:.5rem}
.icon-btn{display:inline-grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;border:0;background:transparent;color:inherit;cursor:pointer}
.icon-btn:hover{background:var(--surface)}
.icon-btn svg{width:20px;height:20px}
.theme-toggle .i-sun,:root[data-theme="dark"] .theme-toggle .i-moon{display:none}
:root[data-theme="dark"] .theme-toggle .i-sun{display:block}
.menu-toggle{display:none}
.menu-toggle .i-close,.menu-toggle[aria-expanded="true"] .i-menu{display:none}
.menu-toggle[aria-expanded="true"] .i-close{display:block}

/* On pages that open with a photo, the header floats on it until the page scrolls.
   The photo's top edge is washed with the page colour, so normal theme ink stays readable. */
.has-bleed .hd:not(.is-stuck){background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.has-bleed .hd:not(.is-stuck) .nav__list a[aria-current="page"]{background:color-mix(in srgb,var(--surface) 70%,transparent)}

@media (max-width:56rem){
  .hd__phone{display:none}
  .menu-toggle{display:inline-grid}
  .nav{position:absolute;inset-inline:var(--gutter);top:calc(100% + .25rem);margin:0;padding:.5rem;border-radius:var(--r-card);
    background:var(--surface);box-shadow:var(--shadow);
    opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .25s var(--ease),visibility 0s .25s}
  .nav.is-open{opacity:1;visibility:visible;transform:none;transition:opacity .2s,transform .25s var(--ease)}
  .nav__list{flex-direction:column}
  .nav__list a{padding:.85rem 1rem;font-size:1.0625rem;border-radius:14px}
  .nav__list a[aria-current="page"],.has-bleed .hd:not(.is-stuck) .nav__list a[aria-current="page"]{background:var(--bg)}
  .hd__tools{margin-inline-start:auto}
}

/* ---------- Full-bleed photo backgrounds ----------
   Photos never end in a hard line: their edges are masked so they melt into the
   page colour and into the next photo, and a wash of the page colour sits on top. */
.bleed{position:relative;isolation:isolate;overflow:hidden}
.bleed__img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% calc(var(--oy,50%) + var(--py,0px));
  -webkit-mask-image:linear-gradient(transparent 0%,#000 20%,#000 80%,transparent 100%);
  mask-image:linear-gradient(transparent 0%,#000 20%,#000 80%,transparent 100%)}
.bleed::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
/* the first section slides under the floating header and starts on the photo */
.bleed--top{margin-block-start:calc(var(--hd-h) * -1);padding-block-start:var(--hd-h)}
.bleed--top .bleed__img{-webkit-mask-image:linear-gradient(#000 0%,#000 70%,transparent 100%);mask-image:linear-gradient(#000 0%,#000 70%,transparent 100%)}
.bleed--top::before{content:"";position:absolute;inset:0 0 auto;height:9rem;z-index:-1;pointer-events:none;
  background:linear-gradient(color-mix(in srgb,var(--bg) 55%,transparent),transparent)}

/* ---------- Home hero: one huge photo, Shed-style ---------- */
.hero{min-height:max(100svh,40rem);display:grid;grid-template-rows:auto 1fr auto}
.hero .bleed__img{--oy:62%}
.hero::after{background:linear-gradient(to top,var(--bg) 0%,color-mix(in srgb,var(--bg) 62%,transparent) 20%,transparent 42%)}

.ticker{overflow:hidden;border-block:1px solid var(--rule);font-size:.9rem;font-weight:500;white-space:nowrap}
.ticker__track{display:flex;width:max-content}
.ticker__track>span{padding:.45rem 1.25rem;position:relative}
.ticker__track>span::after{content:"";position:absolute;inset-inline-end:-3px;top:50%;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.45;translate:0 -50%}
@media (prefers-reduced-motion:no-preference){
  .ticker__track{animation:tick 70s linear infinite}
}
@keyframes tick{to{transform:translateX(50%)}}

.hero__foot{display:grid;grid-template-columns:1.25fr 1fr;gap:1.5rem clamp(2rem,6vw,6rem);align-items:end;
  padding-block:2rem clamp(2.5rem,5vw,4.5rem)}
.hero__foot h1{font-size:clamp(2.4rem,5.2vw,4.6rem);font-weight:230;line-height:1.22}
.hero__aside{display:grid;gap:1.5rem}
.hero__aside p{color:var(--muted);line-height:2;max-width:34em}
@media (max-width:52rem){
  .hero__foot{grid-template-columns:1fr}
  .hero::after{background:linear-gradient(to top,var(--bg) 0%,color-mix(in srgb,var(--bg) 80%,transparent) 38%,transparent 64%)}
}

/* Hero load: the photo settles and the words rise, slowly */
@media (prefers-reduced-motion:no-preference){
  .js .hero .bleed__img{scale:1.06;animation:settle 2.8s var(--ease-soft) forwards}
  .js .rise{opacity:0;transform:translateY(16px);animation:rise 1.6s var(--ease-soft) forwards;animation-delay:calc(var(--d,0) * 160ms + 200ms)}
}
@keyframes rise{to{opacity:1;transform:none}}
@keyframes settle{to{scale:1}}

/* Scroll reveal: a very soft fade-up, applied by app.js to content below the fold */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(14px);
    transition:opacity 1.6s var(--ease-soft),transform 1.8s var(--ease-soft);transition-delay:calc(var(--ri,0) * 90ms)}
  .reveal.is-in{opacity:1;transform:none}
}

/* ---------- Sections ---------- */
.section{padding-block:clamp(4.5rem,9vw,8rem)}
.section--deep{background:linear-gradient(var(--bg) 0%,var(--deep) 16%,var(--deep) 84%,var(--bg) 100%)}
.section-head{display:grid;gap:1rem;margin-block-end:clamp(2.5rem,5vw,4rem);max-width:44rem}

/* ---------- Halves: photo fills one half and melts into the text side ---------- */
.halves{display:grid;grid-template-columns:1fr 1fr;min-height:min(56rem,100svh)}
.halves__photo{position:relative;min-height:28rem;overflow:hidden;
  -webkit-mask-image:linear-gradient(to left,#000 55%,transparent 100%),linear-gradient(transparent 0%,#000 16%,#000 84%,transparent 100%);
  mask-image:linear-gradient(to left,#000 55%,transparent 100%),linear-gradient(transparent 0%,#000 16%,#000 84%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect}
.halves__photo img{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover}
.halves--flip .halves__photo{order:2;
  -webkit-mask-image:linear-gradient(to right,#000 55%,transparent 100%),linear-gradient(transparent 0%,#000 16%,#000 84%,transparent 100%);
  mask-image:linear-gradient(to right,#000 55%,transparent 100%),linear-gradient(transparent 0%,#000 16%,#000 84%,transparent 100%)}
.halves__text{display:grid;align-content:center;gap:1.5rem;padding-block:clamp(4rem,8vw,7rem);
  padding-inline:clamp(1.25rem,5vw,5rem);max-width:44rem}
@media (max-width:52rem){
  .halves{grid-template-columns:1fr;min-height:0}
  .halves__photo,.halves--flip .halves__photo{order:0;min-height:62svh;
    -webkit-mask-image:linear-gradient(transparent 0%,#000 14%,#000 70%,transparent 100%);mask-image:linear-gradient(transparent 0%,#000 14%,#000 70%,transparent 100%)}
  .halves__text{margin-block-start:-4rem;position:relative}
}

.feat__list{display:grid}
.feat__item{display:grid;gap:.4rem;padding-block:1.4rem;border-block-start:1px solid var(--rule)}
.feat__item:last-child{border-block-end:1px solid var(--rule)}
.feat__item h3{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.25rem 1rem}
.feat__item h3 .latin{font-size:.8125rem;font-weight:450;color:var(--muted)}
.feat__item p{color:var(--muted);max-width:34em}

.facts{display:grid;grid-template-columns:auto 1fr;gap:1.5rem 3rem;margin-block-start:.5rem;padding-block-start:1.75rem;border-block-start:1px solid var(--rule)}
.facts dt{font-size:.875rem;color:var(--muted);font-weight:500}
.facts dd{font-size:1.0625rem;font-weight:600}
.facts dd.big{font-size:clamp(2.4rem,4.5vw,3.5rem);font-weight:200;line-height:1.1}

/* ---------- Statement over a full-bleed photo ---------- */
.statement{min-height:min(52rem,92svh);display:grid;align-items:center}
.statement::after{background:linear-gradient(to left,color-mix(in srgb,var(--bg) 88%,transparent) 0%,color-mix(in srgb,var(--bg) 50%,transparent) 30%,transparent 58%)}
.statement__text{display:grid;gap:1.5rem;max-width:40rem}
.statement__text p:first-child{font-size:clamp(2.2rem,5vw,4.4rem);font-weight:220;line-height:1.25}
.statement__text p+p{color:var(--muted);font-size:1.0625rem;line-height:2;max-width:32em}
@media (max-width:52rem){
  .statement{align-items:start;padding-block:4rem}
  .statement::after{background:linear-gradient(var(--bg) 0%,color-mix(in srgb,var(--bg) 75%,transparent) 45%,transparent 85%)}
}

/* ---------- Decor families as edge-band coils ---------- */
.coils{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(1rem,2.5vw,2rem)}
.coil{display:grid;gap:.65rem;align-content:start}
.coil__disc{aspect-ratio:1;border-radius:50%;margin-block-end:.6rem;
  background:
    radial-gradient(circle,var(--deep) 0 15%,#B39572 15.5% 21%,transparent 21.5%),
    var(--gloss,linear-gradient(transparent,transparent)),
    repeating-radial-gradient(circle,var(--c1) 0 4px,var(--c2) 4px 5px);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.1),0 22px 34px -22px rgba(51,36,27,.55)}
.coil h3{font-size:1.0625rem}
.coil p{font-size:.95rem;line-height:1.8;color:var(--muted)}
@media (max-width:60rem){.coils{grid-template-columns:repeat(3,1fr)}}
@media (max-width:36rem){
  .coils{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:62%;overflow-x:auto;scroll-snap-type:x mandatory;
    margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);padding-block-end:1rem;scrollbar-width:none}
  .coils::-webkit-scrollbar{display:none}
  .coil{scroll-snap-align:start}
}

/* ---------- Application tiles ---------- */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.tile a{display:grid;height:100%;grid-template-rows:auto 1fr;text-decoration:none;border-radius:var(--r-tile);overflow:hidden;background:var(--surface)}
.tile__img{aspect-ratio:4/5;overflow:hidden}
.tile__img img{width:100%;height:100%;object-fit:cover;transition:scale .6s var(--ease)}
.tile a:hover .tile__img img,.tile a:focus-visible .tile__img img{scale:1.05}
.tile__body{display:grid;gap:.3rem;align-content:start;padding:1.1rem 1.2rem 1.4rem}
.tile__title{font-weight:650;font-size:1.0625rem}
.tile__need{font-size:.9rem;line-height:1.75;color:var(--muted)}
.more{margin-block-start:2.25rem}
@media (max-width:60rem){.tiles{grid-template-columns:repeat(2,1fr)}}
@media (max-width:36rem){
  .tiles{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;overflow-x:auto;scroll-snap-type:x mandatory;
    margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);padding-block-end:1rem;scrollbar-width:none}
  .tiles::-webkit-scrollbar{display:none}
  .tile{scroll-snap-align:start}
}

/* ---------- Closing call over the dark veneer photo ----------
   Fades in from the page colour at the top and back into it at the bottom. */
.closer{min-height:min(52rem,96svh);display:grid;align-items:end;color:var(--cream)}
.closer::after{background:linear-gradient(transparent 0%,rgba(20,14,11,.3) 28%,rgba(20,14,11,.82) 70%,rgba(20,14,11,.9) 86%,var(--bg) 100%)}
.closer .bleed__img{-webkit-mask-image:linear-gradient(transparent 0%,#000 32%);mask-image:linear-gradient(transparent 0%,#000 32%)}
.closer__grid{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem clamp(2rem,6vw,6rem);align-items:end;padding-block:clamp(4rem,8vw,6rem) clamp(6rem,11vw,9rem)}
.closer__grid > div{display:grid;gap:1.25rem}
.closer .lead,.closer .muted{color:var(--cream-muted)}
.closer__phones{display:grid;gap:.25rem}
.closer__phones a{font-size:clamp(2rem,4vw,3.2rem);font-weight:220;text-decoration:none;line-height:1.35;width:fit-content}
.closer__phones a:hover{color:var(--oak)}
.closer__phones .muted{font-size:.9rem;margin-block-end:.5rem}
.closer :focus-visible{outline-color:var(--cream)}
@media (max-width:52rem){.closer__grid{grid-template-columns:1fr}}

/* ---------- Page hero (inner pages) ---------- */
.page-hero{min-height:max(72svh,30rem);display:grid;align-items:end}
.page-hero::after{background:linear-gradient(to top,var(--bg) 0%,color-mix(in srgb,var(--bg) 62%,transparent) 22%,transparent 46%)}
.page-hero--short{min-height:max(56svh,26rem)}
.page-hero__text{display:grid;gap:1.25rem;padding-block:clamp(3rem,6vw,4.5rem);max-width:52rem}
.page-hero__text .display{font-weight:250}
.page-hero__text p{color:var(--muted);line-height:2;max-width:40em}

/* ---------- Applications accordion ---------- */
.app-list{display:grid;gap:.75rem}
.app-row{border-radius:var(--r-tile);background:var(--surface);overflow:hidden}
.app-row summary{display:grid;grid-template-columns:auto 1fr auto;gap:1.25rem;align-items:center;padding:1.1rem 1.25rem;cursor:pointer;list-style:none}
.app-row summary::-webkit-details-marker{display:none}
.app-row__sw{width:3.25rem;height:3.25rem;border-radius:50%;background:radial-gradient(circle,var(--surface) 0 17%,#B39572 17.5% 24%,transparent 24.5%),var(--sw);box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}
.app-row__head{display:grid;gap:.1rem}
.app-row__title{font-size:1.25rem;font-weight:600}
.app-row__need{font-size:.95rem;color:var(--muted);line-height:1.7}
.app-row__icon{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--bg);transition:transform .35s var(--ease),background-color .2s}
.app-row__icon svg{width:14px;height:14px}
.app-row[open] .app-row__icon{transform:rotate(45deg);background:var(--btn);color:var(--btn-ink)}
.app-row summary:hover .app-row__icon{background:var(--deep)}
.app-row[open] summary:hover .app-row__icon{background:var(--btn-hover)}
.app-row__body{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:1.5rem 2.5rem;padding:.25rem 1.25rem 1.5rem}
.app-row__img{border-radius:14px;aspect-ratio:16/10;object-fit:cover;width:100%}
.app-row__body h3{font-size:.95rem;margin-block-end:.6rem}
.app-row__body ul{display:grid;gap:.45rem}
.app-row__body li{position:relative;padding-inline-start:1.1rem;font-size:.95rem;line-height:1.8;color:var(--muted)}
.app-row__body li::before{content:"";position:absolute;inset-inline-start:0;top:.75em;width:.45rem;height:2px;border-radius:2px;background:var(--oak)}
.app-row__body .muted{margin-block-start:.9rem;font-size:.9rem}
@media (prefers-reduced-motion:no-preference){
  .app-row[open] .app-row__body{animation:open .45s var(--ease)}
}
@keyframes open{from{opacity:0;transform:translateY(-8px)}}
@media (max-width:52rem){
  .app-row__body{grid-template-columns:1fr}
  .app-row summary{gap:.9rem;padding:1rem}
  .app-row__sw{width:2.6rem;height:2.6rem}
}

/* ---------- About ---------- */
.year{font-size:clamp(6rem,17vw,13rem);font-weight:100;line-height:1;color:var(--oak);margin:0}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.about-grid > div{display:grid;gap:1.5rem}
@media (max-width:52rem){.about-grid{grid-template-columns:1fr}}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:1rem;align-items:stretch}
.phone-card{display:grid;align-content:space-between;gap:2.5rem;padding:clamp(1.75rem,4vw,2.75rem);border-radius:var(--r-card);background:var(--ebony);color:var(--cream)}
.phone-card dt{font-size:.95rem;color:var(--cream-muted)}
.phone-card dd{display:grid;gap:.25rem}
.phone-card a{font-size:clamp(1.75rem,3.6vw,2.6rem);font-weight:250;text-decoration:none;width:fit-content;line-height:1.4}
.phone-card a:hover{color:var(--oak)}
.phone-card :focus-visible{outline-color:var(--oak)}
.channels{display:grid;border-radius:var(--r-card);background:var(--surface);padding:.5rem clamp(1.25rem,3vw,2rem)}
.channels__row{display:grid;grid-template-columns:9rem 1fr;gap:1rem;padding-block:1.15rem;border-block-end:1px solid var(--rule)}
.channels__row:last-child{border-block-end:0}
.channels dt{color:var(--muted);font-size:.95rem}
.channels dd{font-weight:550}
.channels a{color:var(--honey)}
@media (max-width:52rem){
  .contact-grid{grid-template-columns:1fr}
  .channels__row{grid-template-columns:1fr;gap:.15rem}
}

/* ---------- Footer ---------- */
.ft{padding-block:clamp(3.5rem,6vw,5rem) 2rem}
.ft__grid{display:grid;grid-template-columns:1.4fr .8fr 1.2fr;gap:2.5rem}
.ft h2{font-size:.875rem;font-weight:600;color:var(--muted);margin-block-end:1rem}
.ft__intro{margin-block-start:1.25rem;color:var(--muted);font-size:.95rem;max-width:30em}
.ft__links{display:grid;gap:.4rem}
.ft__links a{text-decoration:none;font-size:.95rem}
.ft__links a:hover{color:var(--honey)}
.ft address p{font-size:.95rem;line-height:1.9}
.ft address p+p{margin-block-start:.5rem}
.ft address strong{font-weight:600}
.ft address a{text-decoration:none}
.ft__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 2rem;margin-block-start:3rem;padding-block-start:1.5rem;border-block-start:1px solid var(--rule);font-size:.875rem;color:var(--muted)}
@media (max-width:52rem){.ft__grid{grid-template-columns:1fr 1fr}.ft__grid>:first-child{grid-column:1/-1}}
@media (max-width:30rem){.ft__grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}
