/* ================= CONTACT PAGE ================= */
.subhero{position:relative;background:var(--deep);color:#F3EFE4;overflow:hidden;padding-top:calc(150px + env(safe-area-inset-top,0px));padding-bottom:150px}
.subhero-copy{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;max-width:760px;margin-inline:auto}
.crumbs{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--mist)}
.crumbs a{transition:color .3s}
.crumbs a:hover{color:var(--gold)}
.crumbs .sep{color:var(--gold)}
.crumbs [aria-current]{color:var(--gold-l)}
.subhero h1{font-size:clamp(44px,6.6vw,86px);line-height:1.15}
.subhero h1 .gold{color:var(--gold)}
.subhero .sub-lead{font-size:clamp(17px,1.6vw,20px);color:var(--mist);font-weight:300;line-height:1.95}
.ghost-word{position:absolute;left:50%;transform:translateX(-50%);bottom:-30px;font-family:var(--f-display);font-size:clamp(110px,16vw,240px);font-weight:700;color:transparent;-webkit-text-stroke:1px rgba(196,157,91,.12);line-height:1;pointer-events:none;white-space:nowrap}

/* quick contact cards, lifted over the hero edge */
.quick{position:relative;z-index:2;margin-top:-96px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.quick{grid-template-columns:1fr}}
.qcard{background:var(--paper);border:1px solid var(--line);border-radius:26px;padding:28px;display:flex;flex-direction:column;gap:16px;box-shadow:0 30px 60px -40px rgba(10,38,34,.55);transition:transform .5s var(--ease),border-color .4s}
.qcard:hover{transform:translateY(-6px);border-color:var(--gold)}
.qcard .top{display:flex;align-items:center;gap:14px}
.qcard i{width:54px;height:54px;border-radius:16px;background:var(--deep);color:var(--gold);display:grid;place-items:center;flex:none}
.qcard i svg{width:24px;height:24px}
.qcard small{display:block;font-size:13px;color:var(--mute);font-weight:600}
.qcard b{display:block;font-size:18px;color:var(--deep);font-weight:700;word-break:break-word;user-select:all}
.qcard .acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.qcard .acts a,.qcard .acts button{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding-inline:16px;border-radius:999px;border:1px solid var(--line);background:var(--cream);color:var(--green);font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .3s,color .3s,border-color .3s}
.qcard .acts a:hover,.qcard .acts button:hover{background:var(--green);color:#F3EFE4;border-color:var(--green)}
.qcard .acts svg{width:16px;height:16px}
.qcard .acts .primary{background:var(--gold);border-color:var(--gold);color:var(--deep)}
.qcard .acts .primary:hover{background:var(--deep);border-color:var(--deep);color:#F3EFE4}

/* form + side */
.req-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(24px,4vw,44px);align-items:start}
@media (max-width:960px){.req-grid{grid-template-columns:1fr}}
.req{background:var(--paper);border:1px solid var(--line);border-radius:30px;padding:clamp(24px,4vw,44px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:600px){.req{grid-template-columns:1fr}}
.req .head{grid-column:1/-1;display:flex;flex-direction:column;gap:10px;margin-bottom:6px}
.req .head h2{font-size:clamp(26px,3vw,34px);color:var(--deep)}
.req .head p{color:var(--mute);font-size:16px}
.req .full{grid-column:1/-1}
.req .field select{appearance:none;-webkit-appearance:none;background-image:none;padding-left:40px}
.req .sel{position:relative}
.req .sel svg{position:absolute;left:14px;top:50%;width:16px;height:16px;transform:translateY(-50%) rotate(-90deg);color:var(--mute);pointer-events:none}
.req .foot{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:8px;border-top:1px solid var(--line)}
.req .foot p{font-size:14px;color:var(--mute);max-width:44ch}
.req .done{grid-column:1/-1}
.req .done .acts{display:flex;flex-wrap:wrap;gap:10px}
.side{display:flex;flex-direction:column;gap:18px;position:sticky;top:110px}
@media (max-width:960px){.side{position:static}}
.mapcard{position:relative;display:block;overflow:hidden;border-radius:26px;background:var(--deep);color:#F3EFE4;min-height:260px;isolation:isolate}
.mapcard svg.map{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.mapcard .pin{position:absolute;top:42%;left:50%;transform:translate(-50%,-100%);width:46px;height:46px;border-radius:50% 50% 50% 0;rotate:-45deg;background:var(--gold);box-shadow:0 10px 24px -6px rgba(0,0,0,.6);animation:drop 1s var(--ease) both .3s}
.mapcard .pin::after{content:"";position:absolute;inset:13px;border-radius:50%;background:var(--deep)}
.mapcard .pulse{position:absolute;top:42%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:rgba(196,157,91,.5);animation:ripple 2.4s ease-out infinite}
@keyframes ripple{from{transform:scale(1);opacity:.8}to{transform:scale(6);opacity:0}}
@keyframes drop{from{opacity:0;transform:translate(-50%,-160%)}to{opacity:1;transform:translate(-50%,-100%)}}
.mapcard .cap{position:absolute;right:0;left:0;bottom:0;padding:18px 22px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(0deg,rgba(10,38,34,.95),rgba(10,38,34,0))}
.mapcard .cap b{display:block;font-size:17px}
.mapcard .cap small{color:var(--mist);font-size:13px}
.mapcard .cap span.go{width:44px;height:44px;border-radius:50%;background:var(--gold);color:var(--deep);display:grid;place-items:center;flex:none;transition:transform .4s var(--ease)}
.mapcard:hover .cap span.go{transform:translateX(-4px)}
.mapcard .cap svg{width:18px;height:18px}
.side-box{background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:24px;display:flex;flex-direction:column;gap:14px}
.side-box h3{font-size:19px;color:var(--deep)}
.side-box p{font-size:15px;color:var(--mute);line-height:1.85}
.side-box .ftr-soc a{border-color:var(--line);color:var(--green)}
.side-box .ftr-soc a:hover{background:var(--green);border-color:var(--green);color:#F3EFE4}
.side-box.legal{background:var(--sand);border-color:#E2D5B8;flex-direction:row;align-items:flex-start;gap:14px}
.side-box.legal i{width:42px;height:42px;border-radius:12px;background:var(--deep);color:var(--gold);display:grid;place-items:center;flex:none}
.side-box.legal i svg{width:20px;height:20px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:var(--deep);color:#F3EFE4;padding:12px 20px;border-radius:999px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:120}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:640px){
  .subhero{padding-top:calc(128px + env(safe-area-inset-top,0px));padding-bottom:120px}
  .ghost-word{font-size:96px;bottom:-16px}
  .quick{margin-top:-76px;gap:12px}
  .qcard{padding:20px;gap:14px}
  .qcard b{font-size:16px}
}
@media (max-width:600px){.req .foot{flex-direction:column-reverse;align-items:stretch;text-align:center}.req .foot .btn{justify-content:center}.req .done .acts .btn{flex:1 1 100%;justify-content:center}}

/* phones: one contact card at a time, switched with the arrows */
@media (max-width:900px){
  .quick{display:flex;gap:32px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding:10px 16px 30px;scroll-padding-inline:16px;scrollbar-width:none;align-items:stretch}
  .quick::-webkit-scrollbar{display:none}
  .qcard{flex:0 0 100%;scroll-snap-align:start}
  .qcard:hover{transform:none}
  .quick + .mctl{display:flex;margin-top:4px}
}
@media (max-width:900px){.side-box.follow{display:none}}
