/* ═════════════ CONTACT — sunny yellow, one clear ask ═════════════ */
.contact{font-family:var(--sans);position:relative;background:var(--highlight);color:var(--ink);padding:clamp(40px,5vw,70px) 0 0;scroll-margin-top:0;overflow:hidden;
  border-top:2px solid var(--ink)}
.c-pad{padding:0 var(--pad)}
.c-meta{display:flex;justify-content:space-between;padding:10px 0;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.c-rule{height:1px;background:repeating-linear-gradient(90deg,var(--ink) 0 5px,transparent 5px 10px);opacity:.6}
.c-grid{display:grid;grid-template-columns:1.4fr .7fr;gap:clamp(20px,4vw,70px);align-items:end}
.c-main{padding:clamp(34px,5vw,80px) 0 clamp(60px,8vw,120px);position:relative}
.c-hand{font-family:var(--hand);font-size:clamp(26px,2.6vw,38px);transform:rotate(-4deg);display:inline-block;margin-bottom:6px}
.c-title{font-weight:800;text-transform:uppercase;letter-spacing:-.065em;line-height:.86;font-size:clamp(46px,9vw,160px)}
.c-title em{font-family:var(--serif);font-style:italic;font-weight:400;text-transform:none;letter-spacing:-.04em;font-size:1.12em;position:relative;display:inline-block}
.cl{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.cl > span{display:inline-block}
.js .cl > span{transform:translateY(112%);transition:transform 1.1s var(--ease-out)}
.js .c-title.in .cl:nth-child(1) > span{transform:none;transition-delay:.05s}
.js .c-title.in .cl:nth-child(2) > span{transform:none;transition-delay:.22s}
.c-copy{margin-top:clamp(20px,2.4vw,34px);font-family:var(--mono);font-size:clamp(14px,1.2vw,17px);line-height:1.7;max-width:48ch}

.c-mail{display:flex;align-items:center;flex-wrap:wrap;gap:12px 14px;margin-top:clamp(26px,3vw,44px)}
.c-email{font-weight:800;letter-spacing:-.04em;font-size:clamp(22px,3.4vw,52px);line-height:1;border-bottom:3px solid var(--ink);padding-bottom:4px;word-break:break-all;transition:background .3s,padding .3s}
.c-email:hover,.c-email:focus-visible{background:var(--ink);color:var(--highlight);padding:4px 10px;outline:none}
.c-copybtn{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;background:transparent;color:var(--ink);border:1.5px solid var(--ink);border-radius:99px;padding:9px 16px;cursor:pointer;transition:background .25s,color .25s,transform .4s var(--spring)}
.c-copybtn:hover,.c-copybtn:focus-visible{background:var(--ink);color:var(--highlight);transform:rotate(-3deg) scale(1.05);outline:none}
.c-copybtn.done{background:var(--ink);color:var(--highlight)}

.c-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(22px,2.6vw,36px)}
.c-btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:13px;letter-spacing:.1em;text-transform:uppercase;padding:15px 24px;border-radius:99px;border:2px solid var(--ink);background:var(--paper);color:var(--ink);
  box-shadow:5px 5px 0 var(--ink);transition:transform .35s var(--spring),box-shadow .35s;outline-offset:5px}
.c-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.c-btn-dark{background:var(--ink);color:var(--highlight)}
.c-btn:hover,.c-btn:focus-visible{transform:translate(-2px,-2px) rotate(-1deg);box-shadow:8px 8px 0 var(--ink)}
.c-btn:focus-visible{outline:3px solid var(--ink)}

.c-art{position:relative;align-self:end;justify-self:end;width:100%;max-width:440px;margin-bottom:-2px}
.c-art img{display:block;width:100%;height:auto;transform-origin:50% 100%;animation:cSway 5s ease-in-out infinite}
@keyframes cSway{0%,100%{transform:rotate(-1.5deg)}50%{transform:rotate(1.5deg)}}
.c-bubble{position:absolute;z-index:2;top:2%;left:-4%;display:flex;gap:7px;align-items:center;padding:14px 18px;background:var(--paper);border:2px solid var(--ink);border-radius:20px 20px 20px 4px;box-shadow:4px 4px 0 var(--ink);transform:rotate(-5deg)}
.c-bubble i{width:9px;height:9px;border-radius:50%;background:var(--ink);animation:cDot 1.2s ease-in-out infinite}
.c-bubble i:nth-child(2){animation-delay:.18s}.c-bubble i:nth-child(3){animation-delay:.36s}
@keyframes cDot{0%,60%,100%{transform:translateY(0);opacity:.35}30%{transform:translateY(-6px);opacity:1}}

/* ═════════════ FOOTER ═════════════ */
.foot{font-family:var(--sans);background:var(--ink);color:var(--paper);padding:clamp(34px,4vw,56px) 0 22px;overflow:hidden}
.f-pad{padding:0 var(--pad)}
.f-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding-bottom:clamp(20px,3vw,40px);border-bottom:1px dashed rgba(247,240,210,.4)}
.f-nav{display:flex;gap:clamp(16px,3vw,40px)}
.f-nav a,.f-up{font-family:var(--mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;position:relative;padding:4px 0;transition:color .25s}
.f-nav a::after,.f-up::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease-out)}
.f-nav a:hover,.f-up:hover,.f-nav a:focus-visible,.f-up:focus-visible{color:var(--highlight);outline:none}
.f-nav a:hover::after,.f-up:hover::after,.f-nav a:focus-visible::after,.f-up:focus-visible::after{transform:scaleX(1)}
.f-word{font-weight:800;letter-spacing:-.07em;line-height:.82;white-space:nowrap;text-align:center;font-size:calc((100vw - 2 * var(--pad)) / 4.74);padding:clamp(22px,3vw,44px) 0 clamp(8px,1.4vw,18px);color:var(--highlight)}
.f-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;opacity:.75;padding-top:14px;border-top:1px dashed rgba(247,240,210,.4)}

@media (max-width:860px){
  .c-grid{grid-template-columns:1fr}
  .c-art{max-width:300px;justify-self:center;margin-top:-20px}
  .c-main{padding-bottom:20px}
}
@media (prefers-reduced-motion:reduce){.c-art img,.c-bubble i{animation:none}}
