@font-face { font-family: 'Inter Tight'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('/assets/inter-tight-latin.woff2') format('woff2'); }
:root { color-scheme: light; --navy:#003349; --navy-deep:#00283b; --cyan:#23aed1; --link:#007596; --ink:#07182c; --text:#17263a; --muted:#57687b; --soft:#f5f8fa; --tint:#ecf9fd; --line:#dce3e9; --wa:#148643; --email-width:47.25rem; --email-inset:2.375rem; --ease:cubic-bezier(.16,1,.3,1); }
* { box-sizing:border-box; margin:0; }
html { -webkit-text-size-adjust:100%; scrollbar-color:#8ea6b5 #f5f8fa; scrollbar-width:thin; }
body { min-height:100svh; font-family:'Inter Tight',Arial,sans-serif; color:var(--text); line-height:1.5; -webkit-font-smoothing:antialiased; background:#fff; }
body:has(dialog[open]) { overflow:hidden; }
button,input,select,textarea { font:inherit; color:inherit; }
button { -webkit-tap-highlight-color:transparent; }
::selection { background:#bcebf5; color:var(--navy-deep); }
:focus-visible { outline:.1875rem solid var(--link); outline-offset:.25rem; }
.whatsapp-float { position:fixed; bottom:calc(1.5rem + env(safe-area-inset-bottom)); right:calc(1.5rem + env(safe-area-inset-right)); z-index:10; display:grid; place-items:center; width:3.75rem; height:3.75rem; border-radius:.875rem; background:linear-gradient(145deg,#5cf77a 0%,#19c52c 100%); color:#fff; box-shadow:0 .25rem .875rem #07182c24; transition:filter .18s,transform .18s; }
.whatsapp-float:hover { transform:translateY(-2px); }
.whatsapp-float svg { width:2.5rem; height:2.5rem; display:block; }
.page { width:min(calc(100% - 3rem),var(--email-width)); margin:0 auto; padding:3rem 0; }
.mail { background:#fff; padding-bottom:1.5rem; border:1px solid var(--line); border-radius:.875rem; overflow:hidden; animation:open-letter .7s var(--ease) both; }
.mail-bar { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:3.625rem; padding:.875rem 2rem; border-bottom:1px solid var(--line); color:var(--muted); font-size:1rem; }
.crumbs { display:flex; align-items:center; gap:1.125rem; }
.crumbs svg { width:1.375rem; height:1.375rem; flex:none; }
.mail-head { padding:0 var(--email-inset); }
.sender { display:flex; align-items:center; gap:1.125rem; margin-top:1.25rem; padding-bottom:1.125rem; border-bottom:1px solid var(--line); }
.avatar { width:3.5rem; height:3.5rem; flex:none; border-radius:50%; object-fit:contain; }
.who { min-width:0; line-height:1.4; }
.who strong { display:block; color:var(--ink); font-size:1.125rem; font-weight:600; }
.who span { color:var(--muted); font-size:1rem; }
.subject { margin-top:1.75rem; font-size:clamp(2rem,3.06vw,2.9375rem); font-weight:600; line-height:1.07; letter-spacing:-.03em; color:var(--ink); max-width:39rem; text-wrap:pretty; }
.mail-body { padding:1.5rem var(--email-inset) 0; font-size:1.3125rem; line-height:1.35; }
.mail-body p + p { margin-top:1rem; }
.mail-body strong { font-weight:600; color:var(--ink); }
.mail-body .sign { margin-top:1.25rem; }
.sign strong { display:block; font-weight:400; color:inherit; }
.actions { display:grid; grid-template-columns:1fr 1fr; gap:1rem .875rem; margin:1.5rem var(--email-inset) 0; padding-top:1.0625rem; border-top:1px solid var(--line); }
.btn { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.625rem; min-height:3.125rem; padding:.75rem 1.25rem; border:1px solid; border-radius:12px; font-weight:600; font-size:1.0625rem; line-height:1.25; text-decoration:none; text-underline-offset:.25rem; cursor:pointer; transition:transform .18s; }
.btn-solid {
  border-color:#1284a46c;
  background:linear-gradient(180deg,#32b8d6 0%,#22afd0 31%,#20a9ca 100%);
  box-shadow:inset 0 0 4px 1px #ffffffab;
  color:#fff;
}
.btn-solid::after { width:1.25rem; height:1.25rem; flex:none; background:currentColor; content:''; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h15m-6-6 6 6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.btn-solid:hover { transform:translateY(-2px); }
.btn-solid:active {
  box-shadow:
    inset 0 0 6px 2px #ffffff99,
    0 1px 3px 0 #0a112810;
}
.btn-line {
  border-width:1.5px;
  border-color:#e3e6e9d7;
  background:#fff;
  box-shadow:
    inset 0 -4px 6px -2px #bcc6d066,
    0 2px 8px #0a112808;
  color:#0a1128;
}
.actions .btn-line { height:3.125rem; min-height:3.125rem; padding-block:0; }
.btn-line::before { display:grid; width:1.375rem; height:1.375rem; flex:none; place-items:center; border:1.5px solid currentColor; border-radius:50%; content:'+'; font-size:1rem; line-height:1; }
.actions .btn-line::before { display:none; }
.actions .btn-icon { display:block; width:2rem; height:2em; flex:none; }
.btn-line:hover { transform:translateY(-2px); }
.btn-line:active {
  box-shadow:
    inset 0 -4px 6px -2px #bcc6d066,
    0 1px 3px #0a11280d;
}
.btn:focus-visible { outline:2px solid #0a1128; outline-offset:3px; }
.actions .btn-renew { grid-column:1/-1; min-height:3.4375rem; font-size:1.25rem; }
.faq { margin-top:3.5rem; padding-inline:var(--email-inset); }
.faq h2 { margin-bottom:1.5rem; color:var(--ink); font-size:1.875rem; font-weight:600; line-height:1.2; letter-spacing:-.025em; text-wrap:balance; }
.faq-list { border-top:1px solid var(--line); }
.faq details { border-bottom:1px solid var(--line); }
.faq summary { position:relative; padding:1.25rem 2.25rem 1.25rem 0; color:var(--navy); font-size:1.0625rem; font-weight:600; line-height:1.4; list-style:none; cursor:pointer; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::before,.faq summary::after { content:''; position:absolute; top:50%; right:.25rem; width:.875rem; height:1.5px; background:currentColor; }
.faq summary::after { transform:rotate(90deg); }
.faq details[open] summary::after { transform:rotate(0); }
.faq summary:hover { color:var(--link); }
.faq details p { padding:0 2.25rem 1.25rem 0; font-size:1rem; line-height:1.65; }
dialog.modal { width:min(42rem,calc(100% - 2rem)); max-height:calc(100svh - 2rem); margin:auto; padding:0; border:0; border-radius:1rem; background:#fff; color:#0a1128; box-shadow:0 2rem 6rem #00142666; }
dialog.modal::backdrop { background:#00182bb3; backdrop-filter:blur(5px); }
.m-head { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:2rem 2rem 0; }
.m-head h2 { font-size:1.5rem; font-weight:700; letter-spacing:-.025em; color:#0a1128; line-height:1.15; }
.m-head p { margin-top:.625rem; color:#496772; font-size:1rem; line-height:1.5; }
.x { flex:none; width:2.75rem; height:2.75rem; border:0; border-radius:50%; display:grid; place-items:center; background:var(--soft); color:var(--navy); cursor:pointer; }
.x svg { width:1.125rem; height:1.125rem; }
.m-body { padding:1.5rem 2rem 2rem; }
.contact-field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; }
.field { display:grid; gap:.3125rem; margin-bottom:1.25rem; }
.field label { font-size:1rem; font-weight:600; color:#0a1128; }
.field input,.field select,.field textarea { width:100%; min-height:3.3125rem; padding:.9375rem; border:1px solid #c7d5dabe; border-radius:.75rem; background:#fff; color:#0a1128; font-size:.9rem; font-weight:500; caret-color:#0a1128; }
.field select { appearance:none; -webkit-appearance:none; padding-right:2.5rem; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%237c929a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .9375rem center; background-size:12px 8px; }
.field select:invalid { color:#7c929a; }
.field input::placeholder,.field textarea::placeholder { color:#7c929a; font-weight:400; }
.field textarea { min-height:9rem; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus { outline:none; border-color:#0a1128; box-shadow:none; }
.hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.m-body .btn { width:100%; min-height:3.375rem; }
.m-body .btn:disabled { opacity:.65; cursor:wait; }
.contact-whatsapp { margin-top:.75rem; }
.contact-whatsapp::before { display:none; }
.contact-whatsapp svg { width:1.375rem; height:1.375rem; flex:none; }
.err { display:none; margin-bottom:1rem; padding:.75rem .875rem; border-radius:.5rem; background:#fff0f0; color:#9d1530; font-size:.9375rem; }
.err.show { display:block; }
.sent { margin-bottom:1rem; padding:.75rem .875rem; border-radius:.5rem; background:#e8f8ee; color:#0b6532; font-size:.9375rem; }
.sent[hidden] { display:none; }
@keyframes open-letter { from { transform:translateY(.625rem); clip-path:inset(0 0 .75rem round .875rem); } to { transform:translateY(0); clip-path:inset(0 round .875rem); } }
@media (min-width:64rem) { html { font-size:clamp(.875rem,1.04166667vw,1rem); } }
@media (max-width:48rem) { .page { width:min(calc(100% - 2rem),var(--email-width)); padding:2rem 0; } .subject { font-size:clamp(2rem,5.7vw,2.9375rem); } .mail-body { font-size:1.125rem; line-height:1.5; } }
@media (max-width:32rem) { :root { --email-inset:1.375rem; } .page { width:calc(100% - 1.5rem); padding:1.5rem 0; } .mail-bar { min-height:3.25rem; padding:.75rem var(--email-inset); font-size:.875rem; } .crumbs { gap:.625rem; } .sender { gap:.75rem; margin-top:1.125rem; padding-bottom:1.125rem; } .avatar { width:2.75rem; height:2.75rem; } .who strong { font-size:1rem; } .who span { font-size:.875rem; } .subject { margin-top:1.5rem; font-size:clamp(1.875rem,8vw,2.5rem); line-height:1.1; } .mail-body { padding-top:1.5rem; font-size:1rem; line-height:1.55; } .mail-body p + p { margin-top:1.125rem; } .actions { margin-top:1.5rem; gap:.625rem; } .actions .btn-renew { font-size:1rem; padding-inline:1rem; } .actions .btn { font-size:.9375rem; padding-inline:.625rem; } .faq { margin-top:2.5rem; padding-inline:.5rem; } .faq h2 { font-size:1.625rem; } .m-head { padding:1.5rem 1.25rem 0; gap:.5rem; } .m-body { padding:1.25rem; } }
@media (max-width:38rem) { .contact-field-grid { grid-template-columns:1fr; gap:0; } }
@media (max-width:64rem) { .page { padding-bottom:6rem; } .whatsapp-float { right:calc(1rem + env(safe-area-inset-right)); bottom:calc(1rem + env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; } }
