/* Contact page — loaded only on /contact/. Builds on the tokens, pills and hero buttons in style.css. */

.ct-section-title{font-size:clamp(26px,2.6vw,34px);font-weight:800;letter-spacing:-.8px;line-height:1.45;text-wrap:balance}
.ct-section-lead{margin-top:6px;color:var(--muted);font-size:15.5px}

/* Hero */
.ct-hero{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(34px,4.4vw,62px) clamp(40px,4.6vw,66px);background:linear-gradient(178deg,#fdf1ef 0%,#f9ece6 55%,var(--paper) 100%)}
.ct-hero::before{content:'';position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#ecd3cb 1.2px,transparent 1.2px);background-size:26px 26px;mask-image:radial-gradient(ellipse 45% 70% at 24% 50%,#000 10%,transparent 70%);opacity:.8}
.ct-hero-inner{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,60px);align-items:center}
.ct-hero-copy{min-width:0}
.ct-status{display:inline-flex;align-items:center;gap:10px;padding:7px 16px 7px 14px;border-radius:999px;background:#ffffffd9;border:1px solid #f1dcd7;font-size:14px;font-weight:600;color:var(--ink-2)}
.ct-status-dot{width:9px;height:9px;border-radius:50%;background:#9a918a}
.ct-status.is-open .ct-status-dot{background:#2f9e61;box-shadow:0 0 0 5px #2f9e6122}
.ct-hero h1{margin:18px 0 14px;font-size:clamp(33px,4vw,54px);font-weight:800;line-height:1.4;letter-spacing:-1.6px}
.ct-hero h1 span{display:block}
.ct-title-accent{color:var(--brand)}
.ct-lead{font-size:clamp(15.5px,1.2vw,17px);color:var(--muted);line-height:2.05;max-width:520px}
.ct-quick{display:flex;flex-wrap:wrap;align-items:center;gap:12px 14px;margin-top:26px}
.ct-quick .hero-cta{min-height:56px;padding:13px 24px}
.ct-quick-link{display:inline-flex;align-items:center;gap:7px;padding:8px 6px;font-size:15px;font-weight:700;color:var(--ink-2)}
.ct-quick-link .icon{width:19px;height:19px;color:var(--brand)}
.ct-quick-link:hover{color:var(--brand)}

.ct-stage{position:relative;min-width:0;aspect-ratio:1/.8;display:grid;place-items:center}
.ct-ring{position:absolute;width:min(360px,84%);aspect-ratio:1;border-radius:50%;border:1.5px dashed #ecc3bd}
.ct-plate{position:relative;z-index:2;width:min(260px,62%);padding:18px 18px 8px;border-radius:40px;background:#fff;box-shadow:0 28px 60px #7a2a2014,0 6px 16px #22201e0a;rotate:-3deg}
.ct-chip{position:absolute;z-index:3;display:grid;place-items:center;width:52px;height:52px;border-radius:18px;background:#fff;border:1px solid #f1dcd7;color:var(--brand);box-shadow:0 14px 30px #22201e12}
.ct-chip .icon{width:24px;height:24px}
.ct-chip-1{top:8%;inset-inline-start:12%;rotate:-8deg}
.ct-chip-2{top:22%;inset-inline-end:6%;rotate:7deg;background:var(--brand);color:#fff;border-color:var(--brand)}
.ct-chip-3{bottom:8%;inset-inline-start:18%;rotate:6deg}
.ct-spark{position:absolute;bottom:14%;inset-inline-end:16%;width:22px;height:22px;background:var(--brand);clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%)}
@media (prefers-reduced-motion:no-preference){
  .ct-rise{animation:ct-rise .7s var(--ease) both}
  .ct-hero h1.ct-rise{animation-delay:.07s}
  .ct-lead.ct-rise{animation-delay:.14s}
  .ct-quick.ct-rise{animation-delay:.21s}
  .ct-plate{animation:ct-rise .8s .15s var(--ease) both}
  .ct-chip{animation:ct-pop .6s calc(.45s + var(--d,0s)) var(--ease) both,ct-bob 6s calc(1.2s + var(--d,0s)) ease-in-out infinite}
  .ct-chip-2{--d:.12s}.ct-chip-3{--d:.24s}
  .ct-ring{animation:art-spin 70s linear infinite}
}
@keyframes ct-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes ct-pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes ct-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* Consultation form beside the call card */
.ct-connect{padding-block:clamp(44px,5vw,70px);scroll-margin-top:80px}
.ct-connect-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(16px,2vw,26px);align-items:start}
.ct-connect-grid.is-single{grid-template-columns:minmax(0,760px);justify-content:center}
.ct-form-card{padding:clamp(22px,2.6vw,34px);border-radius:28px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 44px #22201e0a}
.ct-form-head h2{font-size:clamp(22px,2vw,27px);font-weight:800}
.ct-form-head p{margin-top:4px;color:var(--muted);font-size:15px}
.ct-form{display:grid;gap:16px;margin-top:22px}
.ct-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ct-field{display:grid;gap:7px;min-width:0}
.ct-field>span,.ct-field legend{font-size:14px;font-weight:700;color:var(--ink-2)}
.ct-field small{font-weight:500;color:var(--soft)}
.ct-field input,.ct-field select,.ct-field textarea{width:100%;min-height:50px;padding:11px 16px;border-radius:15px;border:1px solid var(--line);background:var(--paper);font-size:15.5px;color:var(--ink);transition:border-color var(--fast),background var(--fast),box-shadow var(--fast)}
.ct-field textarea{min-height:96px;resize:vertical;line-height:1.9}
.ct-field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238d857c' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 14px center;background-size:18px;padding-left:42px}
.ct-field input[dir="ltr"]{text-align:right}
.ct-field input::placeholder,.ct-field textarea::placeholder{color:#b3a99e}
.ct-field input:hover,.ct-field select:hover,.ct-field textarea:hover{border-color:#d8cab8}
.ct-field input:focus,.ct-field select:focus,.ct-field textarea:focus{outline:none;border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px #db2c271c}
.ct-field.is-invalid input{border-color:var(--brand);background:#fff7f6}
.ct-times{gap:9px}
.ct-chips{display:flex;flex-wrap:wrap;gap:8px}
.ct-chip-option{position:relative;display:inline-flex}
.ct-chip-option input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.ct-chip-option span{display:inline-flex;align-items:center;min-height:40px;padding:6px 16px;border-radius:999px;border:1px solid var(--line);background:var(--paper);font-size:14.5px;font-weight:600;transition:background var(--fast),color var(--fast),border-color var(--fast)}
.ct-chip-option input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.ct-chip-option input:focus-visible+span{outline:3px solid var(--brand);outline-offset:3px}
.ct-submit{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:4px}
.ct-submit .pill{min-width:200px}
.ct-submit p{font-size:13.5px;color:var(--soft)}
.ct-submit .pill[aria-busy="true"]{opacity:.7;pointer-events:none}
.ct-error,.ct-form-error{display:flex;align-items:center;gap:9px;margin-top:16px;padding:11px 16px;border-radius:14px;background:#fdecea;color:#9b1c17;font-size:14.5px;font-weight:600}
.ct-error .icon{width:18px;height:18px;flex:none}
.ct-form-error{margin-top:0}
.ct-course{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:18px;background:var(--cream)}
.ct-course-mark{--accent:#5a5450;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:color-mix(in srgb,var(--accent) 14%,#fff);color:var(--accent);flex:none}
.ct-course-mark svg{width:26px;height:26px;stroke-width:1.5}
.ct-course>span:nth-child(2){display:grid;line-height:1.6;min-width:0;flex:1}
.ct-course small{font-size:13px;color:var(--soft)}
.ct-course b{font-size:15px}
.ct-course-remove{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:var(--muted)}
.ct-course-remove:hover{background:#fff;color:var(--brand)}
.ct-course-remove .icon{width:18px;height:18px}
.tk-trap{position:absolute!important;inset-inline-start:-9999px;width:1px;height:1px;overflow:hidden}

.ct-sent{display:grid;justify-items:center;gap:10px;text-align:center;padding:24px 0 8px}
.ct-sent-mark{display:grid;place-items:center;width:70px;height:70px;border-radius:50%;background:#edf6f0;color:#2c6446}
.ct-sent-mark .icon{width:34px;height:34px;stroke-width:2.2}
.ct-sent h2{font-size:24px;font-weight:800}
.ct-sent p{color:var(--muted)}
.ct-sent-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:8px}
@media (prefers-reduced-motion:no-preference){.ct-sent-mark{animation:ct-pop .5s var(--ease) both}.ct-sent-mark .icon{stroke-dasharray:30;animation:ct-draw .6s .25s ease-out both}}
@keyframes ct-draw{from{stroke-dashoffset:30}to{stroke-dashoffset:0}}

/* Direct call card: the phone gives a small ring every few seconds so it reads as tappable */
.ct-call-card{position:sticky;top:100px;display:grid;gap:14px;padding:clamp(22px,2.4vw,30px);border-radius:28px;background:var(--night);color:#fff;overflow:hidden}
.ct-call-card::before{content:'';position:absolute;width:260px;aspect-ratio:1;inset-inline-end:-90px;top:-120px;border-radius:50%;border:1.5px dashed #ffffff1f}
.ct-call-card h2{position:relative;font-size:clamp(20px,1.8vw,23px);font-weight:800}
.ct-call-card>p{position:relative;color:var(--night-text);font-size:15px;margin-top:-8px}
.ct-call{position:relative;display:flex;align-items:center;gap:16px;padding:14px 16px 14px 22px;border-radius:22px;background:var(--brand);color:#fff;box-shadow:0 16px 34px #db2c2740;transition:background var(--fast),transform var(--fast),box-shadow var(--fast)}
.ct-call:hover{background:var(--brand-hover);transform:translateY(-2px);box-shadow:0 22px 40px #db2c274d}
.ct-call:active{transform:translateY(0) scale(.98)}
.ct-call-icon{position:relative;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#fff;color:var(--brand);flex:none}
.ct-call-icon .icon{position:relative;z-index:1;width:25px;height:25px;stroke-width:2}
.ct-call-wave{position:absolute;inset:0;border-radius:50%;border:2px solid #fff;opacity:0}
.ct-call-text{display:grid;line-height:1.5;min-width:0}
.ct-call-text small{font-size:13.5px;opacity:.88}
.ct-call-text b{font-family:var(--font-num);font-size:clamp(21px,1.9vw,25px);font-weight:800;letter-spacing:.6px;text-align:start}
.ct-call-hours{position:relative;display:grid;gap:8px;padding-top:14px;border-top:1px dashed #ffffff26}
.ct-call-hours li{display:grid;grid-template-columns:18px auto 1fr;align-items:center;gap:9px;font-size:14px;color:var(--night-text)}
.ct-call-hours .icon{width:17px;height:17px;color:var(--pink)}
.ct-call-hours b{justify-self:end;color:#fff;font-weight:600}
@media (prefers-reduced-motion:no-preference){
  .ct-call-icon .icon{animation:ct-ring 3.6s 1s ease-in-out infinite;transform-origin:50% 60%}
  .ct-call-wave{animation:ct-wave 3.6s 1s ease-out infinite}
  .ct-call-wave+.ct-call-wave{animation-delay:1.25s}
  .ct-call:hover .ct-call-icon .icon{animation-duration:1.2s;animation-delay:0s}
}
@keyframes ct-ring{0%,62%,100%{transform:rotate(0)}66%{transform:rotate(-16deg)}70%{transform:rotate(14deg)}74%{transform:rotate(-12deg)}78%{transform:rotate(10deg)}82%{transform:rotate(-5deg)}86%{transform:rotate(0)}}
@keyframes ct-wave{0%,60%{opacity:0;transform:scale(1)}64%{opacity:.75}100%{opacity:0;transform:scale(1.75)}}

/* Branch, location and hours */
.ct-branch{padding-block:clamp(50px,5.6vw,80px);background:#fff;border-block:1px solid var(--line);scroll-margin-top:80px}
.ct-branch .ct-section-title{margin-bottom:clamp(20px,2.4vw,30px)}
.ct-branch-card{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);border-radius:28px;border:1px solid var(--line);background:var(--paper);overflow:hidden}
.ct-map{position:relative;min-height:360px;background:#efe7dc}
.ct-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ct-map.is-sketch{background:linear-gradient(135deg,#f3ece2,#ece2d4);overflow:hidden}
.ct-map-streets{position:absolute;inset:-20%;background:
  linear-gradient(12deg,transparent 47%,#fff 47%,#fff 53%,transparent 53%),
  linear-gradient(98deg,transparent 45%,#fffdf9 45%,#fffdf9 49%,transparent 49%),
  linear-gradient(-28deg,transparent 60%,#fffdf9 60%,#fffdf9 62.5%,transparent 62.5%),
  repeating-linear-gradient(12deg,transparent 0 58px,#fffdf980 58px 61px),
  repeating-linear-gradient(98deg,transparent 0 74px,#fffdf980 74px 77px)}
.ct-map-pin{position:absolute;top:44%;left:50%;display:grid;place-items:center;width:58px;height:58px;margin:-58px 0 0 -29px;border-radius:50% 50% 50% 6px;rotate:-45deg;background:var(--brand);color:#fff;box-shadow:0 14px 28px #db2c2750}
.ct-map-pin .icon{rotate:45deg;width:26px;height:26px}
.ct-map-pin::after{content:'';position:absolute;inset:-12px;border-radius:inherit;border:2px solid #db2c2755;opacity:0}
.ct-map-label{position:absolute;top:calc(44% + 14px);left:50%;translate:-50% 0;padding:5px 14px;border-radius:999px;background:#fff;font-size:14px;font-weight:700;box-shadow:0 8px 20px #22201e14;white-space:nowrap}
@media (prefers-reduced-motion:no-preference){.ct-map-pin::after{animation:ct-pin 2.6s ease-out infinite}}
@keyframes ct-pin{0%{opacity:.8;transform:scale(.8)}100%{opacity:0;transform:scale(1.4)}}
.ct-branch-info{display:grid;align-content:start;gap:14px;padding:clamp(22px,2.6vw,34px)}
.ct-branch-badge{justify-self:start;display:inline-flex;align-items:center;gap:6px;padding:3px 12px;border-radius:999px;background:var(--blush);color:var(--brand);font-size:13px;font-weight:700}
.ct-branch-badge .icon{width:15px;height:15px}
.ct-branch-info h3{font-size:clamp(22px,2vw,27px);font-weight:800}
.ct-address{font-size:16px;color:var(--ink-2);line-height:2}
.ct-hours{padding:16px 18px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.ct-hours h4{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;margin-bottom:8px}
.ct-hours h4 .icon{width:18px;height:18px;color:var(--brand)}
.ct-hours li{display:flex;justify-content:space-between;gap:12px;padding-block:6px;font-size:15px}
.ct-hours li+li{border-top:1px dashed var(--line)}
.ct-hours li span{color:var(--muted)}
.ct-hours li b{font-weight:700}
.ct-routes{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.ct-routes .pill{min-height:48px;padding-inline:20px}

/* Placement nudge */
.ct-placement{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px clamp(18px,2.4vw,30px);margin-top:22px;padding:18px clamp(18px,2.4vw,28px);border-radius:24px;background:linear-gradient(100deg,#fdefee,#fbf3ee);border:1px solid #f3d9d4}
.ct-placement-ladder{display:flex;align-items:flex-end;gap:5px;padding:10px 12px;border-radius:16px;background:#fff}
.ct-placement-ladder i{display:block;width:10px;height:calc(10px + var(--i) * 6px);border-radius:4px;background:#f1e4dd}
.ct-placement-ladder i:nth-child(3){background:var(--brand)}
.ct-placement h3{font-size:18px;font-weight:800}
.ct-placement p{font-size:14.5px;color:var(--muted)}
.ct-placement-actions{display:flex;flex-wrap:wrap;gap:10px}
.ct-placement-actions .pill{min-height:46px;padding-inline:20px}

/* Social profiles */
.ct-social{padding-block:clamp(50px,5.6vw,80px) 0}
.ct-social .ct-section-title,.ct-social .ct-section-lead{text-align:center}
.ct-social-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:clamp(22px,2.6vw,32px)}
.ct-social-grid li{flex:1 1 220px;max-width:280px}
.ct-social-card{--tone:var(--brand);display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:22px;background:#fff;border:1px solid var(--line);transition:border-color var(--fast),transform var(--fast),box-shadow var(--fast)}
.ct-social-card.is-instagram{--tone:#c13584}
.ct-social-card.is-telegram{--tone:#2a9fd8}
.ct-social-card.is-whatsapp{--tone:#25a35a}
.ct-social-card.is-youtube{--tone:#e02f2f}
.ct-social-card.is-linkedin{--tone:#0a66c2}
.ct-social-card:hover{border-color:color-mix(in srgb,var(--tone) 45%,#fff);transform:translateY(-3px);box-shadow:0 16px 32px #22201e0d}
.ct-social-icon{display:grid;place-items:center;width:50px;height:50px;border-radius:16px;background:color-mix(in srgb,var(--tone) 12%,#fff);color:var(--tone);flex:none;transition:background var(--fast),color var(--fast)}
.ct-social-card:hover .ct-social-icon{background:var(--tone);color:#fff}
.ct-social-card>span:nth-child(2){display:grid;line-height:1.6;flex:1;min-width:0}
.ct-social-card b{font-size:16px}
.ct-social-card small{font-size:13px;color:var(--soft)}
.ct-social-go{width:18px;height:18px;color:var(--soft);transform:scaleX(-1)}

/* FAQ */
.ct-faq{padding-block:clamp(50px,5.6vw,80px) clamp(64px,7vw,100px)}
.ct-faq-inner{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(22px,4vw,60px);max-width:1060px;align-items:start}
.ct-faq-list{display:grid;gap:10px}
.ct-faq details{border:1px solid var(--line);border-radius:18px;background:#fff;transition:border-color var(--fast)}
.ct-faq details[open]{border-color:#e2cfc4}
.ct-faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 20px;font-weight:700;font-size:16px;cursor:pointer;list-style:none}
.ct-faq summary::-webkit-details-marker{display:none}
.ct-faq summary .icon{width:20px;height:20px;color:var(--soft);transition:transform var(--fast);flex:none}
.ct-faq details[open] summary .icon{transform:rotate(180deg)}
.ct-faq details p{padding:0 20px 18px;color:var(--muted);line-height:2.05;font-size:15px}
.ct-faq details a{color:var(--brand);font-weight:700}

/* Responsive */
@media (max-width:980px){
  .ct-connect-grid{grid-template-columns:1fr}
  .ct-call-card{position:relative;top:0;order:-1}
  .ct-branch-card{grid-template-columns:1fr}
  .ct-map{min-height:260px}
  .ct-placement{grid-template-columns:auto minmax(0,1fr)}
  .ct-placement-actions{grid-column:1/-1}
  .ct-faq-inner{grid-template-columns:1fr}
}
@media (max-width:900px){
  .ct-hero-inner{grid-template-columns:1fr}
  .ct-hero-copy{text-align:center;display:grid;justify-items:center}
  .ct-lead{margin-inline:auto}
  .ct-quick{justify-content:center}
  .ct-stage{display:none}
}
@media (max-width:620px){
  .ct-row{grid-template-columns:1fr}
  .ct-quick .hero-cta{flex:1 1 0;min-width:0;min-height:52px;padding:12px;font-size:14.5px;gap:8px}
  .ct-quick-link{width:100%;justify-content:center}
  .ct-submit .pill{width:100%}
  .ct-placement{grid-template-columns:1fr;text-align:center;justify-items:center}
  .ct-placement-actions{justify-content:center}
  .ct-routes .pill{flex:1 1 auto}
  .ct-social-grid li{max-width:none}
}
