/* ============================================================
   VERVE v2 — home : work plate, drawings, about, contact.
   (The hero internals live in hero.css.)
   ============================================================ */

/* ---------- shared bits ---------- */

.skip {
  position: fixed; top: .75rem; left: .75rem; z-index: calc(var(--z-preload) + 1);
  padding: .7em 1.1em; background: var(--ink); color: var(--paper);
  border-radius: 999px; transform: translateY(-200%);
  transition: transform var(--dur-1) var(--ease-out);
}
.skip:focus-visible { transform: none; }

.sec-head {
  display: flex; align-items: baseline; gap: 1rem;
  margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}
.sec-head__no { font-size: .72rem; color: color-mix(in srgb, var(--terra) 78%, var(--ink)); flex: none; }   /* AA at label size */
.caps .num { color: color-mix(in srgb, var(--terra) 78%, var(--ink)); }
.sec-head__rule { flex: 1; height: 1px; background: var(--line); align-self: center; }
.sec-head__title {
  order: -1; flex: none;
  font-size: var(--t-lg); line-height: 1; letter-spacing: -.025em;
}

.contact__north { fill: none; stroke: currentColor; stroke-width: 1; vector-effect: non-scaling-stroke; }

/* ---------- work : a plate of equal tiles (like a comic planche) ---------- */

.work { position: relative; padding-top: var(--section); padding-bottom: calc(var(--section) * .35); background: var(--paper); overflow-x: clip; }
.work__static { display: grid; gap: .75rem; font-family: var(--f-display); font-size: var(--t-md); }

.plate__head, .tile__cap {
  font-family: var(--f-display); font-style: italic; font-weight: 400; text-transform: uppercase;
  font-variation-settings: "SOFT" 100, "WONK" 1; letter-spacing: .07em;
}
.plate__head {
  display: flex; justify-content: space-between; gap: 1rem;
  margin: calc(clamp(2.5rem, 5vw, 4.5rem) * -.45) 0 clamp(1.75rem, 3.4vw, 3rem);
  font-size: clamp(.8rem, .7rem + .35vw, 1.05rem); color: var(--ink-2);
}
.plate {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(2.25rem, 6.5vw, 7.5rem); row-gap: clamp(5.5rem, 9vw, 8.5rem);
  padding-bottom: clamp(1rem, 2vw, 2rem);
}

.tile { --fig: var(--terra); position: relative; }
.tile__link { display: block; color: var(--ink); }
.tile__link:focus-visible { outline: none; }
.tile__link:focus-visible .tile__win { outline: 2px solid var(--ink); outline-offset: 6px; }
.tile__frame { position: relative; container-type: inline-size; }
.tile__win {
  position: relative; aspect-ratio: 1.414; overflow: hidden;
  background: var(--sheet); border: 1.5px solid var(--ink);
}
.tile__win img {
  width: 100%; height: 100%; object-fit: cover;
  object-position: var(--tile-pos, 50% 50%); transform-origin: var(--tile-pos, 50% 50%);
  transform: scale(var(--tile-zoom, 1));
  transition: transform 1.4s var(--ease-out);
}
.tile__link:hover .tile__win img, .tile__link:focus-visible .tile__win img { transform: scale(calc(var(--tile-zoom, 1) * 1.04)); }
.tile__cap {
  margin-top: clamp(.85rem, 1.4vw, 1.25rem); text-align: center;
  font-size: clamp(1rem, .82rem + .62vw, 1.4rem); line-height: 1.2; text-wrap: balance;
}
.tile__no { color: color-mix(in srgb, var(--fig) 80%, var(--ink)); }
.tile__meta { margin-top: .35rem; text-align: center; color: var(--ink-3); }

/* figures: one adult = 24% of the frame width; boxes in figure units (figures.js) */
.tile__figs { position: absolute; inset: 0; z-index: 2; pointer-events: none; color: var(--fig); }
.fig {
  position: absolute; font-size: 24cqi;
  left: calc(var(--x) * 1%); top: calc(var(--y) * 1% + var(--yo));
  width: calc(var(--w) * .01em); height: calc(var(--h) * .01em);
  margin: calc(var(--ay) * -.01em) 0 0 calc(var(--ax) * -.01em);
  transition: transform 1.1s var(--ease-out) var(--fd), opacity .6s ease var(--fd);
}
.fig__flip, .fig__move { display: block; width: 100%; height: 100%; transform-origin: calc(var(--ax) * .01em) 100%; }
.fig.is-flip .fig__flip { transform: scaleX(-1); }
.fig svg { display: block; width: 100%; height: 100%; overflow: visible; }
.plate.is-armed .tile:not(.is-in) .fig { opacity: 0; transform: translate(var(--ex), var(--ey)); }
.tile__link:hover .fig, .tile__link:focus-visible .fig { transform: translate(var(--hx), var(--hy)); transition-delay: 0s; }

/* limbs rest at their drawn angle; the loops swing them around it */
.fg-leg, .fg-arm, .fg-fore, .fg-shin, .fg-dleg, .fg-tail, .fg-kick, .fg-kleg, .fg-reach { transform: rotate(var(--r, 0deg)); }
.fg-arm { transition: transform .6s var(--ease-out); }
.fig--pace .fig__move { animation: fg-pace var(--pd) linear infinite; }
.fig--pace .fg-leg, .fig--walk .fg-arm { animation: fg-swing .62s ease-in-out infinite alternate; }
.fig--walk.fig--pace svg { animation: fg-bob .62s ease-in-out infinite; }
.fg-dleg { animation: fg-swing .31s ease-in-out infinite alternate; }
.fg-tail { animation: fg-wag .45s ease-in-out infinite alternate; }
.fg-fore { animation: fg-wave 1.5s ease-in-out infinite alternate; }
.tile__link:hover .fig--wave .fg-arm, .tile__link:focus-visible .fig--wave .fg-arm { transform: rotate(-16deg); }
.fg-shin { animation: fg-dangle 2.4s ease-in-out infinite alternate; }
.fg-shin--b { animation-delay: -1.3s; }
.fig--kid .fig__move { animation: fg-hop 1.5s cubic-bezier(.3, 0, .3, 1) infinite; }
.fg-kick { animation: fg-kick 1.5s ease-in-out infinite; }
.fg-reach { animation: fg-point 2.6s ease-in-out infinite alternate; }
.fig--lean svg, .fig--look svg, .fig--dress svg { transform-origin: calc(var(--ax) * .01em) 100%; animation: fg-sway 4.8s ease-in-out infinite alternate; }
.fig--look svg { animation-duration: 3.4s; }
.tile:not(.is-live) .fig *, .tile:not(.is-live) .fig__move { animation-play-state: paused; }
.reduced .fig, .reduced .fig * { animation: none !important; transition: none !important; }

@keyframes fg-swing { from { transform: rotate(var(--r)); } to { transform: rotate(calc(var(--r) * -1)); } }
@keyframes fg-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2.4%); } }
@keyframes fg-pace {
  0% { transform: translateX(0); } 47% { transform: translateX(var(--pace)); }
  50% { transform: translateX(var(--pace)) scaleX(-1); } 97% { transform: translateX(0) scaleX(-1); }
  100% { transform: translateX(0); }
}
@keyframes fg-wag { from { transform: rotate(-18deg); } to { transform: rotate(16deg); } }
@keyframes fg-wave { from { transform: rotate(-10deg); } to { transform: rotate(16deg); } }
@keyframes fg-dangle { from { transform: rotate(var(--r)); } to { transform: rotate(calc(var(--r) + 16deg)); } }
@keyframes fg-hop { 0%, 100% { transform: translateY(0); } 45% { transform: translateY(-14%); } }
@keyframes fg-kick { 0%, 100% { transform: rotate(14deg); } 45% { transform: rotate(-12deg); } }
@keyframes fg-point { from { transform: rotate(-3deg); } to { transform: rotate(5deg); } }
@keyframes fg-sway { from { transform: rotate(-1.2deg); } to { transform: rotate(1.2deg); } }

@media (max-width: 639px) {
  .plate { grid-template-columns: minmax(0, 1fr); row-gap: clamp(6.5rem, 31vw, 9rem); }
  .plate__head { margin-bottom: clamp(4.25rem, 19vw, 5.25rem); }
  .fig { font-size: 26cqi; }
}
@media (min-width: 640px) { .fig { left: calc(var(--xw) * 1%); } }

/* ---------- drawings (marquee) ---------- */

.drawings { padding-top: calc(var(--section) * .7); padding-bottom: var(--section); overflow: hidden; }
.drawings__rows { display: grid; gap: clamp(1rem, 2vw, 1.75rem); }
.drawings__row .marquee__track { align-items: flex-start; padding-top: .75rem; padding-bottom: 1rem; }

.dsheet { display: block; flex: none; }
.dsheet__paper {
  display: block; height: clamp(140px, 15vw, 236px);
  padding: clamp(6px, .7vw, 10px);
  background: var(--sheet); border: 1px solid var(--line);
  box-shadow: 0 18px 30px -26px rgba(60, 38, 30, .5);
  transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out);
}
.dsheet img { height: 100%; width: auto; max-width: none; }
.dsheet:hover .dsheet__paper, .dsheet:focus-visible .dsheet__paper {
  transform: translateY(-6px) rotate(-.6deg);
  box-shadow: 0 26px 40px -26px rgba(60, 38, 30, .6);
}

/* ---------- about ---------- */

.about { padding-top: calc(var(--section) * .4); padding-bottom: calc(var(--section) * .55); }
.about__grid {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 3rem;
  align-items: start;
}
.about__portrait { grid-column: 1 / 4; max-width: 270px; }
.about__portrait-frame {
  position: relative; overflow: hidden; aspect-ratio: 900 / 1020;
  padding: clamp(8px, 1vw, 14px); background: var(--sheet);
  border: 1px solid var(--line); box-shadow: var(--shadow);
}
.about__portrait-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.about__caption { display: flex; justify-content: space-between; gap: 1rem; margin-top: .8rem; flex-wrap: wrap; }
.about__caption-r { color: var(--ink-3); }
.about__text { grid-column: 5 / 13; padding-top: clamp(0rem, 4vw, 4rem); }
.about__title { font-size: var(--t-lg); margin-bottom: clamp(1.2rem, 2.4vw, 2rem); }
.about__bio { font-size: var(--t-body); }
.about__lead { font-family: var(--f-display); font-size: clamp(1.3rem, 1.05rem + 1vw, 1.95rem); line-height: 1.3; color: var(--ink); font-weight: 300; }
.about__lead strong { font-weight: 400; font-style: italic; color: var(--terra); }
.about__more { margin-top: 1.4rem; color: var(--ink-2); }
.about__more summary {
  display: inline-flex; align-items: center; gap: .6em; cursor: pointer; list-style: none;
  padding-bottom: .3em; border-bottom: 1px solid var(--line); color: var(--ink);
}
.about__more summary::-webkit-details-marker { display: none; }
.about__more summary::after { content: "+"; font-family: var(--f-mono); transition: transform var(--dur-1) var(--ease-out); }
.about__more[open] summary::after { transform: rotate(45deg); }
.about__more p { margin-top: 1.1em; max-width: 60ch; }

.about__lists {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 3rem;
  margin-top: clamp(3rem, 6vw, 5rem); align-items: start;
}
.about__col { grid-column: 1 / 9; }
.about__practices { margin-top: clamp(4rem, 8vw, 7rem); }
.about__list-h { padding-bottom: .9rem; margin-bottom: .4rem; border-bottom: 1px solid var(--ink); color: var(--ink); }

.caps { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--gap); }
.caps li {
  display: flex; align-items: baseline; gap: .6rem;
  padding: .7rem 0; border-bottom: 1px solid var(--line-soft);
  font-family: var(--f-mono); font-size: .78rem; letter-spacing: .02em; color: var(--ink);
}
.caps li i {
  flex: 1; min-width: 1rem; height: 1px; transform: translateY(-.25em);
  background: radial-gradient(circle, var(--ink-3) 40%, transparent 45%) 0 50% / 6px 2px repeat-x;
  opacity: .8;
}

/* practices : a plate of logos, one cell each (hairlines between cells, none on the outer left) */
.practices { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); overflow: hidden; }
.practice {
  display: flex; flex-direction: column; gap: .35rem; margin-left: -1px;
  padding: clamp(1.4rem, 2.4vw, 2.2rem) clamp(.9rem, 1.6vw, 1.5rem);
  border-left: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft);
}
.practice__mark { display: flex; align-items: center; height: clamp(4.5rem, 7vw, 6rem); margin-bottom: .9rem; }
.practice__mark img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
html[data-theme="dusk"] .practice__mark img { filter: invert(1); }
.practice__word { font-family: var(--f-display); font-size: clamp(1.25rem, 1rem + .7vw, 1.6rem); line-height: 1.12; color: var(--ink); }
.practice__name { font-family: var(--f-sans); font-size: .95rem; color: var(--ink); }
.practice__name[hidden] { display: block; visibility: hidden; }
.practice__place { color: var(--ink-3); }
.practice__works { margin-top: .35rem; font-size: .84rem; line-height: 1.4; color: var(--ink-2); }
.practice__ig { align-self: flex-start; margin-top: auto; padding-top: 1rem; color: var(--ink); transition: color var(--dur-1) var(--ease-out); }
.practice__ig:hover, .practice__ig:focus-visible { color: var(--terra); }

/* exploded axonometric that draws itself (built by about-axo.js) */
.axo { grid-column: 10 / 13; }
.axo:not(.is-built) { visibility: hidden; }
.axo__svg { display: block; width: 100%; max-width: 340px; height: auto; margin-left: auto; overflow: visible; }
.axo__cap { display: block; max-width: 340px; margin: .4rem 0 0 auto; text-align: right; color: var(--ink-3); }
.axo .f { stroke: none; }
.axo .f-t, .axo .f-fl { fill: var(--paper-3); }
.axo .f-l { fill: var(--paper); }
.axo .f-r { fill: var(--paper-2); }
.axo .f-in { fill: color-mix(in srgb, var(--paper-2) 82%, var(--ink)); }
.axo .f-in2 { fill: color-mix(in srgb, var(--paper-2) 90%, var(--ink)); }
.axo .f-cut { fill: color-mix(in srgb, var(--terra) 16%, var(--paper-3)); }
.axo .hatch, .axo .hatch-t { fill: url(#axo-hatch); }
.axo .hatch-ln { stroke: var(--terra); stroke-width: .55; }
.axo .gl { fill: color-mix(in srgb, var(--sage) 85%, var(--paper-3)); }
html[data-theme="dusk"] .axo .gl { fill: color-mix(in srgb, var(--glow) 70%, var(--paper)); }
.axo .ln { fill: none; stroke: var(--ink); stroke-width: .6; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.axo .an, .axo .an-n circle, .axo .an-n path { fill: none; stroke: var(--ink-3); stroke-width: .5; }
.axo .an-n path, .axo .an-bar, .axo .an-fill { fill: var(--ink-3); stroke: none; }
.axo .an-cut { stroke: var(--terra); stroke-dasharray: 9 2.5 1.5 2.5; }
.axo .an-tk { stroke: var(--ink); stroke-width: .8; }
.axo .an-fill--t { fill: var(--terra); }
.axo text { font-family: var(--f-mono); font-size: 9.5px; letter-spacing: .04em; fill: var(--ink-3); }
.axo .an-t--t { fill: var(--terra); }
.axo .gd { fill: none; stroke: var(--terra); stroke-width: .55; stroke-dasharray: 2 2.5; opacity: 0; }
/* drawing in : strokes first, line by line, then the washes and annotations */
.axo.is-armed .ln { stroke-dashoffset: 1; transition: stroke-dashoffset 1s var(--ease-io) calc(var(--i) * 12ms); }
.axo.is-armed .f { opacity: 0; transition: opacity .9s ease calc(var(--i) * 12ms + .7s); }
.axo.is-armed text, .axo.is-armed .an, .axo.is-armed .an-n, .axo.is-armed .an-bar, .axo.is-armed .an-fill { opacity: 0; transition: opacity .9s ease 1.8s; }
.axo.is-drawn .ln { stroke-dashoffset: 0; }
.axo.is-drawn .f, .axo.is-drawn text, .axo.is-drawn .an, .axo.is-drawn .an-n, .axo.is-drawn .an-bar, .axo.is-drawn .an-fill { opacity: 1; }

@media (max-width: 1023px) {
  .about__portrait { grid-column: 1 / 5; }
  .about__text { grid-column: 5 / 13; padding-top: 0; }
}
@media (max-width: 1180px) {
  .about__col { grid-column: 1 / 8; }
  .axo { grid-column: 8 / 13; }
  .practices { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .axo__svg, .axo__cap { max-width: 300px; }
}
@media (max-width: 719px) {
  .about__portrait, .about__text, .about__col, .axo { grid-column: 1 / -1; }
  .about__portrait { max-width: 270px; }
  .caps { grid-template-columns: 1fr; }
  .axo__svg { width: auto; height: min(290px, 72vw); max-width: 100%; margin: 0 auto; }
  .axo__cap { max-width: none; text-align: center; margin-right: auto; }
  .axo text { font-size: 12px; }
}
/* phones: a small framed portrait with its caption beside it, not a full-width photo */
@media (max-width: 600px) {
  .about__grid { row-gap: 2rem; }
  .about__portrait { display: grid; grid-template-columns: 46% minmax(0, 1fr); column-gap: 1rem; align-items: end; max-width: none; }
  .about__portrait-frame { padding: 6px; }
  .about__caption { flex-direction: column; justify-content: flex-end; gap: .4rem; margin-top: 0; padding-bottom: .25rem; }
  .practices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .practice:last-child:nth-child(odd) { grid-column: 1 / -1; }
}

/* ---------- contact ---------- */

.contact { position: relative; margin-top: calc(var(--section) * .1); color: var(--earth-ink); }
.contact__body {
  position: relative; margin-top: -1px;
  background: var(--earth); padding-top: clamp(.25rem, 1.2vw, 1rem);
  transition: background-color var(--dur-3) var(--ease-io);
}

/* ground line — an undulating section cut continued from the cover (drawn by home.js):
   jungle above, stones fading into the earth poché below */
.ground {
  position: relative; height: clamp(300px, 46vw, 600px);
  overflow: hidden; pointer-events: none; contain: layout paint;
}
.ground::before { /* no-JS edge: a soft mound */
  content: ""; position: absolute; left: -10%; right: -10%; bottom: 0; height: 40%;
  background: var(--earth); border-radius: 50% 50% 0 0 / 30% 30% 0 0;
}
.ground.is-drawn::before { display: none; }
.ground__cut { position: absolute; left: 0; top: 0; display: block; z-index: 6; }
.ground__poche { fill: var(--earth); transition: fill var(--dur-3) var(--ease-io); }
.ground__line { fill: none; stroke: var(--sheet); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; opacity: .92; }
.ground__scene { position: absolute; inset: 0; }
/* stones in section: muted stone tones mixed from the earth, fine dark outlines */
.gr { stroke: rgba(30, 14, 10, .62); stroke-width: .8; stroke-linejoin: round; }
.gr--1 { fill: color-mix(in srgb, var(--earth) 55%, #b9a596); }
.gr--2 { fill: color-mix(in srgb, var(--earth) 68%, #8c7869); }
.gr--3 { fill: color-mix(in srgb, var(--earth) 72%, #2c1b16); }
.gr--4 { fill: color-mix(in srgb, var(--earth) 60%, #a48a74); }
.gr-hi { fill: none; stroke: rgba(241, 230, 216, .32); stroke-width: .9; stroke-linecap: round; }
.gr-lo { fill: none; stroke: rgba(30, 14, 10, .35); stroke-width: 1.6; stroke-linecap: round; }
.gr-dots { fill: none; stroke: rgba(241, 230, 216, .22); stroke-width: 1.5; stroke-linecap: round; }
.gr-strata { fill: none; stroke: rgba(20, 8, 6, .28); stroke-width: .8; stroke-dasharray: 10 6 2 6; }

.g { position: absolute; display: block; transform-origin: var(--ox, 50%) 100%; }
.g img {
  display: block; width: 100%; height: auto;
  filter: hue-rotate(var(--hue, 0deg)) brightness(var(--br, 1));
}
.g img.is-flip { transform: scaleX(-1); }
.g--back { opacity: .58; }
.g--back img { filter: hue-rotate(var(--hue, 0deg)) saturate(.7) brightness(calc(var(--br, 1) * 1.06)); }
.g--tree, .g--plant, .g--grass { animation: g-sway var(--per) ease-in-out var(--dl) infinite alternate; }
.g--walk { animation: var(--an, none) var(--dur) linear var(--dl) infinite; }
.g--walk img { animation: g-bob 1.15s ease-in-out infinite alternate; }
.g--idle { animation: g-sway 4.5s ease-in-out var(--dl) infinite alternate; --amp: .8deg; }
.ground.is-paused .g, .ground.is-paused .g img { animation-play-state: paused; }
.ground.is-still .g, .ground.is-still .g img, .reduced .g, .reduced .g img { animation: none; }
@keyframes g-sway { from { transform: rotate(calc(var(--amp) * -1)); } to { transform: rotate(var(--amp)); } }
@keyframes g-bob { from { transform: translateY(0); } to { transform: translateY(-1.5%); } }
/* dusk: darker, cooler foliage */
html[data-theme="dusk"] .g img { filter: hue-rotate(calc(var(--hue, 0deg) + 8deg)) saturate(.72) brightness(calc(var(--br, 1) * .6)); }
html[data-theme="dusk"] .g--back { opacity: .5; }
html[data-theme="dusk"] .g--person img { filter: saturate(.8) brightness(.68); }
html[data-theme="dusk"] .ground__line { opacity: .6; }
html[data-theme="dusk"] .gr-hi { stroke: rgba(241, 230, 216, .2); }

.contact__inner { position: relative; z-index: 1; }
.contact .label { color: var(--earth-ink-2); }
.sec-head--earth .sec-head__no { color: var(--glow); }
.sec-head--earth .sec-head__rule { background: rgba(241, 230, 216, .2); }

.sec-head--earth .sec-head__title { color: var(--earth-ink); }

.contact__mail-wrap { margin-top: clamp(.6rem, 1.6vw, 1.4rem); display: grid; gap: 1rem; justify-items: start; }
.contact__mail {
  position: relative; display: inline-block;
  font-size: clamp(1.55rem, 4.8vw, 5.2rem);
  line-height: 1.05; letter-spacing: -.035em;
  color: var(--earth-ink);
  overflow-wrap: anywhere;
  padding-bottom: .12em;
}
.contact__mail::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: var(--glow); transform: scaleX(0); transform-origin: 100% 50%;
  transition: transform var(--dur-3) var(--ease-out);
}
.contact__mail:hover::after, .contact__mail:focus-visible::after { transform: scaleX(1); transform-origin: 0 50%; }
.contact__mail:focus-visible, .contact a:focus-visible, .contact button:focus-visible { outline-color: var(--glow); }

.contact__links {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  margin-top: clamp(2rem, 4vw, 3rem);
}
.contact__ig { color: var(--earth-ink) !important; }
.contact__north { width: 30px; color: var(--earth-ink-2); }
.contact__north path { fill: var(--earth-ink-2); }
.contact__north text { fill: var(--earth-ink-2); stroke: none; font: 500 8px var(--f-mono); }

.foot {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  padding: 1.1rem 0 calc(1.5rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(241, 230, 216, .2);
}
.foot__top { transition: color var(--dur-1); }
.foot__top:hover { color: var(--earth-ink) !important; }

@media (max-width: 380px) {
  .foot { flex-direction: column; align-items: flex-start; }
}
.contact .sec-head { margin-bottom: clamp(.8rem, 2vw, 1.6rem); }
