@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Outfit:wght@300;400;500;600;700;800&display=swap');
:root{--deep:#0B4251;--dark:#1A6A7A;--mid:#2A9D8F;--bright:#3DBFB0;--soft:#A8DADC;--pale:#D6F4F6;--sky:#EAF9FA;--text:#0D2B31;--text2:#2A6A75;--text3:#5A9FAA;--white:#FFF;--warn:#E67E22;--pf:'Press Start 2P',monospace;--bd:'Outfit',sans-serif;--r:12px;--sh:0 4px 24px rgba(11,66,81,.12)}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--bd);background:var(--sky);color:var(--text);line-height:1.7;font-size:16px;overflow-x:hidden}

/* NAV */
.sitenav{background:var(--deep);position:sticky;top:0;z-index:100;box-shadow:0 2px 12px rgba(0,0,0,.25)}
.sitenav-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 24px;height:62px}
.sitenav-logo{font-family:var(--pf);font-size:12px;color:var(--bright);text-decoration:none;letter-spacing:1px;display:flex;align-items:center;gap:8px}
.sitenav-logo-dot{display:inline-block;width:9px;height:9px;background:var(--bright)}
.sitenav-home{background:var(--mid);color:var(--white);padding:8px 20px;border-radius:8px;font-weight:700;font-size:14px;text-decoration:none;transition:all .2s;display:flex;align-items:center;gap:8px}
.sitenav-home:hover{background:var(--bright);transform:translateY(-1px)}

/* HOME BUTTON BANNER (large, prominent) */
.home-banner{background:var(--deep);padding:20px 24px;text-align:center}
.home-banner a{display:inline-flex;align-items:center;gap:10px;background:var(--mid);color:var(--white);padding:14px 32px;border-radius:var(--r);font-weight:700;font-size:16px;text-decoration:none;transition:all .2s;box-shadow:0 4px 16px rgba(42,157,143,.4)}
.home-banner a:hover{background:var(--bright);transform:translateY(-2px)}

/* PAGE HEADER */
.page-header{background:linear-gradient(135deg,#0D4F61,#1A7A8A);padding:60px 24px 48px;text-align:center}
.page-header .tag{font-family:var(--pf);font-size:8px;color:var(--bright);letter-spacing:2px;text-transform:uppercase;margin-bottom:16px;display:block}
.page-header h1{font-size:clamp(24px,3.5vw,42px);font-weight:800;color:var(--white);line-height:1.2;margin-bottom:14px;max-width:800px;margin-left:auto;margin-right:auto}
.page-header p{font-size:17px;color:var(--pale);max-width:620px;margin:0 auto;line-height:1.7}

/* CONTENT */
.page-content{max-width:860px;margin:0 auto;padding:60px 24px}
.page-content h2{font-size:26px;font-weight:800;color:var(--deep);margin:40px 0 16px;line-height:1.3}
.page-content h3{font-size:19px;font-weight:700;color:var(--dark);margin:28px 0 12px}
.page-content p{font-size:16px;color:var(--text2);margin-bottom:16px;line-height:1.8}
.page-content ul,.page-content ol{padding-left:24px;margin-bottom:16px}
.page-content li{font-size:16px;color:var(--text2);margin-bottom:8px;line-height:1.7}
.page-content strong{color:var(--text);font-weight:700}
.page-content a{color:var(--mid);text-decoration:underline}
.page-content a:hover{color:var(--bright)}

/* CALLOUT BOXES */
.callout{border-radius:var(--r);padding:20px 24px;margin:28px 0}
.callout-tip{background:var(--pale);border-left:4px solid var(--mid)}
.callout-warn{background:#FFF8F0;border-left:4px solid var(--warn)}
.callout-key{background:linear-gradient(135deg,var(--deep),#1A6A7A);color:var(--white);padding:28px;border-radius:var(--r)}
.callout-key h3{color:var(--bright);margin-top:0}
.callout-key p,.callout-key li{color:var(--pale)}
.callout h3{margin-top:0;margin-bottom:10px}

/* FAQ BOXES */
.faq-item{background:var(--white);border:1px solid var(--pale);border-radius:var(--r);padding:20px 24px;margin-bottom:12px}
.faq-item summary{font-size:16px;font-weight:700;color:var(--deep);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer}
.faq-item summary::after{content:'+';font-size:22px;color:var(--mid);flex-shrink:0}
details[open] summary::after{content:'−'}
.faq-item p{margin-top:14px;font-size:15px;color:var(--text2);line-height:1.7;margin-bottom:0}

/* LANGUAGE DIVIDER */
.lang-divider{border:none;border-top:3px dashed var(--soft);margin:60px 0;position:relative}
.lang-divider-label{text-align:center;margin:40px 0 24px;font-family:var(--pf);font-size:8px;color:var(--text3);letter-spacing:2px}
.es-section{background:var(--white);border-radius:var(--r);border:1px solid var(--pale);padding:40px;margin-top:8px}
.es-badge{display:inline-block;background:#EDE8F8;color:#5A3A98;font-size:10px;font-weight:700;padding:3px 10px;border-radius:4px;letter-spacing:1px;margin-bottom:20px;font-family:var(--bd)}
.es-section h1,.es-section h2{color:var(--deep)}
.es-section p{color:var(--text2)}

/* TABLE */
.data-table{width:100%;border-collapse:collapse;margin:20px 0;font-size:15px}
.data-table th{background:var(--deep);color:var(--white);padding:12px 16px;text-align:left;font-weight:700}
.data-table td{padding:11px 16px;border-bottom:1px solid var(--pale);color:var(--text2)}
.data-table tr:nth-child(even) td{background:var(--sky)}

/* CTA SECTION */
.cta-section{background:linear-gradient(135deg,var(--deep),#1A7080);padding:60px 24px;text-align:center;margin-top:60px}
.cta-section h2{font-size:30px;font-weight:800;color:var(--white);margin-bottom:14px}
.cta-section p{font-size:17px;color:var(--pale);margin-bottom:28px;max-width:560px;margin-left:auto;margin-right:auto}
.cta-btn{display:inline-block;background:var(--mid);color:var(--white);padding:18px 36px;border-radius:var(--r);font-weight:700;font-size:17px;text-decoration:none;transition:all .2s;box-shadow:0 4px 16px rgba(42,157,143,.45)}
.cta-btn:hover{background:var(--bright);transform:translateY(-2px);color:var(--white)}

/* FOOTER */
.sitefooter{background:var(--deep);color:var(--soft);padding:40px 24px 24px;text-align:center}
.sitefooter-links{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-bottom:16px}
.sitefooter-links a{color:var(--text3);text-decoration:none;font-size:13px;transition:color .2s}
.sitefooter-links a:hover{color:var(--bright)}
.sitefooter p{font-size:12px;color:rgba(90,159,170,.55);line-height:1.7}

/* RESPONSIVE */
@media(max-width:700px){.page-header{padding:40px 20px 36px}.page-content{padding:40px 20px}.es-section{padding:24px}.sitenav-logo{font-size:10px}}
