:root { --navy:#0b1b33; --navy-2:#132b4d; --gold:#c8a45d; --cream:#f6f4ef; --ink:#152238; --muted:#718096; --line:#dfe4e8; --white:#fff; color-scheme: light; }
* { box-sizing:border-box; border-color:var(--line); }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
.site-shell { overflow:hidden; }
.section-wrap { width:min(1180px, calc(100% - 64px)); margin-inline:auto; }
.site-header { height:78px; display:flex; align-items:center; justify-content:space-between; padding:0 max(32px, calc((100vw - 1180px)/2)); background:rgba(246,244,239,.92); backdrop-filter:blur(14px); position:sticky; top:0; z-index:20; border-bottom:1px solid rgba(21,34,56,.08); }
.brand { display:flex; align-items:center; color:var(--navy); white-space:nowrap; }.brand-logo { display:block; width:auto; height:49px; max-width:205px; object-fit:contain; }
.main-nav { display:flex; gap:27px; margin-left:auto; margin-right:34px; }.main-nav a { color:#67758a; font-size:12px; transition:color .2s; }.main-nav a:hover { color:var(--gold); }.header-cta,.button { display:inline-flex; align-items:center; justify-content:center; gap:10px; font-size:12px; font-weight:700; letter-spacing:.03em; transition:transform .2s, background .2s, color .2s; }.header-cta { background:var(--navy); color:#fff; padding:13px 18px; }.header-cta:hover,.button:hover { transform:translateY(-2px); }.menu-button { display:none; background:none; border:0; color:var(--navy); }
.hero { min-height:620px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; padding-top:55px; padding-bottom:75px; }.eyebrow,.section-kicker { display:flex; align-items:center; gap:9px; text-transform:uppercase; font-size:10px; letter-spacing:.18em; color:var(--gold); font-weight:700; }.eyebrow-dot,.pulse { width:6px; height:6px; border-radius:50%; display:inline-block; background:var(--gold); box-shadow:0 0 0 5px rgba(200,164,93,.14); }.hero h1 { max-width:600px; color:var(--navy); margin:25px 0 18px; font-family:Georgia, 'Times New Roman', serif; font-size:clamp(48px,6vw,78px); font-weight:400; line-height:.98; letter-spacing:-.045em; }.hero h1 em,h2 em { color:var(--gold); font-style:normal; }.hero-copy > p { max-width:420px; color:#6d7b8e; font-size:17px; line-height:1.6; margin:0; }.hero-actions { display:flex; gap:12px; margin-top:32px; flex-wrap:wrap; }.button { padding:15px 20px; }.button-gold { background:var(--gold); color:var(--navy); }.button-ghost { border:1px solid #c7ced6; color:var(--navy); }.button-dark { background:var(--navy); color:#fff; }.button-light { color:var(--navy); background:#fff; }.hero-note { display:flex; align-items:center; gap:8px; color:#91a0af; font-size:11px; margin-top:42px; }.hero-note svg { color:var(--gold); }
.hero-art { height:420px; position:relative; }.art-glow { position:absolute; width:320px; height:320px; border-radius:50%; top:40px; right:70px; background:radial-gradient(circle, #e5d6b6 0, #eee8da 47%, transparent 70%); opacity:.7; }.currency-card { position:absolute; width:220px; height:135px; padding:21px; border-radius:4px; box-shadow:0 20px 35px rgba(13,32,58,.15); display:flex; flex-direction:column; color:#fff; }.currency-card span { font-family:Georgia,serif; font-size:35px; opacity:.9; }.currency-card strong { font-size:12px; letter-spacing:.14em; margin-top:5px; }.currency-card small { opacity:.6; font-size:9px; margin-top:4px; }.card-one { background:linear-gradient(135deg,#19406c,#0a1b32); top:73px; right:72px; transform:rotate(7deg); z-index:2; }.card-two { background:linear-gradient(135deg,#c8a45d,#8f6b2d); top:160px; right:214px; transform:rotate(-14deg); z-index:1; }.card-three { background:linear-gradient(135deg,#526f87,#1f3a57); top:224px; right:31px; transform:rotate(18deg); z-index:3; }.coin { position:absolute; display:grid; place-items:center; border-radius:50%; font-family:Georgia,serif; font-weight:bold; z-index:4; box-shadow:0 8px 18px #15223835; }.coin-a { width:65px;height:65px; right:32px; top:52px; background:#c8a45d; color:#fff; border:5px solid #ddc488; }.coin-b { width:48px;height:48px; left:76px; bottom:54px; background:#102946; color:#c8a45d; border:3px solid #48607c; }.art-caption { position:absolute; bottom:0; right:45px; color:#6f7e90; font-size:10px; display:flex; align-items:center; gap:9px; }.art-caption b { color:var(--navy); }
.rates-section { padding:78px 0 110px; }.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:28px; }.section-heading h2,h2 { font-family:Georgia,serif; font-weight:400; letter-spacing:-.04em; font-size:48px; line-height:1.02; margin:13px 0 0; color:var(--navy); }.section-heading p { font-size:12px; color:#778597; line-height:1.7; margin:0 5px 4px 0; }.rates-panel { background:#fff; border:1px solid #e3e6e8; }.rates-panel-head,.rate-row { display:grid; grid-template-columns:1.5fr .7fr .7fr; align-items:center; }.rates-panel-head { padding:16px 24px; color:#a0aaba; text-transform:uppercase; letter-spacing:.16em; font-size:9px; border-bottom:1px solid var(--line); }.rates-panel-head span:not(:first-child) { text-align:right; }.rate-row { min-height:70px; padding:0 24px; border-bottom:1px solid #edf0f2; }.currency-name { display:flex; align-items:center; gap:14px; }.flag { display:grid; place-items:center; width:34px;height:34px; background:var(--cream); border-radius:50%; font-size:18px; }.currency-name strong { display:block; color:var(--navy); font-size:13px; }.currency-name small { display:block; color:#9aa6b5; font-size:10px; margin-top:4px; letter-spacing:.08em; }.rate-dash { color:#aeb8c3; text-align:right; font-size:14px; font-weight:400; }.rate-foot { display:flex; justify-content:space-between; gap:20px; padding:17px 24px; color:#8b98a8; font-size:10px; }.rate-foot span:first-child { display:flex; align-items:center; gap:7px; color:#66778a; }.rate-foot svg { color:var(--gold); }
.converter-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; align-items:center; padding:100px 0; border-top:1px solid var(--line); }.converter-intro p { max-width:260px; color:#7a8795; line-height:1.7; font-size:13px; margin-top:24px; }.converter-card { background:var(--navy); color:#fff; padding:34px; box-shadow:0 25px 50px #10233b20; }.converter-card-top { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:28px; }.converter-card-top .section-kicker { color:#d7b76e; }.converter-card h3 { margin:10px 0 0; font:400 24px Georgia,serif; }.converter-card-top svg { color:var(--gold); }.converter-card label { color:#9eafc1; font-size:10px; text-transform:uppercase; letter-spacing:.12em; display:block; }.converter-card input,.converter-card select { display:block; width:100%; border:1px solid #35506f; background:#142d4e; color:#fff; border-radius:0; height:48px; padding:0 14px; outline:none; margin-top:8px; font-size:14px; }.converter-card input:focus,.converter-card select:focus { border-color:var(--gold); }.select-line { display:grid; grid-template-columns:1fr auto 1fr; align-items:end; gap:12px; margin-top:16px; }.swap-button { width:38px;height:38px; border:1px solid #526b85; background:transparent; color:var(--gold); cursor:pointer; margin-bottom:5px; }.conversion-result { margin-top:25px; padding-top:20px; border-top:1px solid #294564; }.conversion-result span { color:#9eafc1; font-size:10px; text-transform:uppercase; letter-spacing:.12em; }.conversion-result strong { display:block; color:#fff; font:400 clamp(18px,2.5vw,28px) Georgia,serif; margin-top:10px; }.converter-disclaimer { color:#7188a0; display:block; font-size:9px; margin-top:22px; }
.about-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; align-items:center; padding:110px 0; }.about-image { display:grid; place-items:center; width:min(100%, 310px); min-height:220px; margin:auto; }.about-image img { display:block; width:100%; height:auto; }.about-copy > p { max-width:600px; color:#748295; font-size:15px; line-height:1.8; margin:27px 0; }.checks { display:grid; grid-template-columns:1fr 1fr; gap:15px 25px; }.checks span { display:flex; align-items:center; gap:9px; font-size:11px; color:#4d5e72; }.checks svg { color:var(--gold); }
.steps-section { background:#eae8e1; padding:100px 0; }.steps-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:#cbd0d0; border:1px solid #cbd0d0; }.step { background:#eae8e1; padding:30px 29px; min-height:190px; position:relative; }.step > span { color:var(--gold); font:24px Georgia,serif; }.step h3 { margin:28px 0 8px; font:400 24px Georgia,serif; color:var(--navy); }.step p { color:#778495; font-size:12px; line-height:1.6; max-width:220px; }.step svg { position:absolute; right:26px; bottom:28px; color:var(--gold); }
.location-section { display:grid; grid-template-columns:.9fr 1.1fr; gap:85px; padding:110px 0; align-items:center; }.address { display:flex; gap:12px; color:#637388; font-size:13px; line-height:1.8; margin:30px 0; }.address svg { color:var(--gold); flex:none; }.map-card { height:350px; position:relative; overflow:hidden; background:#d9ddd9; border:12px solid #fff; box-shadow:0 18px 35px #14223818; }.map-grid { position:absolute; inset:0; opacity:.5; background:linear-gradient(34deg, transparent 47%, #b4bbb7 48%, #b4bbb7 50%, transparent 51%),linear-gradient(145deg, transparent 42%, #c2c8c2 43%, #c2c8c2 45%, transparent 46%),repeating-linear-gradient(90deg, transparent 0 53px, #c4cac6 54px 55px),repeating-linear-gradient(0deg, transparent 0 41px, #c4cac6 42px 43px); }.map-pin { position:absolute; top:45%;left:52%; display:grid;place-items:center; width:45px;height:45px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--gold); color:#fff; box-shadow:0 9px 15px #14223835; }.map-pin svg { transform:rotate(45deg); }.map-label { position:absolute; left:25px; bottom:23px; display:flex; flex-direction:column; gap:5px; background:#fff; padding:14px 16px; box-shadow:0 5px 15px #14223818; }.map-label strong { font-size:11px; color:var(--navy); }.map-label span { font-size:9px; color:#7d8a98; }.map-controls { position:absolute; top:17px; right:17px; display:flex; flex-direction:column; background:#fff; box-shadow:0 4px 10px #14223818; }.map-controls span { width:28px;height:27px; display:grid;place-items:center; color:var(--navy); border-bottom:1px solid var(--line); }
.contact-section { display:grid; grid-template-columns:1fr 1fr; background:var(--navy); padding:70px 80px; color:#fff; align-items:center; }.contact-section h2 { color:#fff; }.contact-list { display:flex; flex-direction:column; gap:22px; }.contact-list > div { display:flex; gap:14px; align-items:flex-start; }.contact-list svg { color:var(--gold); margin-top:2px; }.contact-list span { color:#aebdcd; font-size:10px; text-transform:uppercase; letter-spacing:.12em; }.contact-list small { display:block; color:#fff; text-transform:none; letter-spacing:0; font-size:15px; margin-top:6px; }.contact-list .button { align-self:flex-start; margin-top:6px; }
.final-cta { display:flex; align-items:center; justify-content:space-between; padding:90px 0; }.final-cta h2 { margin-top:15px; }.final-cta p { color:#748295; font-size:13px; }.final-cta .hero-actions { margin-top:0; }.site-footer { background:#eae8e1; padding:45px 0 18px; }.footer-inner { display:flex; align-items:start; justify-content:space-between; }.footer-brand .brand-logo { height:57px; max-width:235px; }.site-footer p { color:#87919b; font-size:11px; margin-top:18px; }.footer-links { display:flex; gap:22px; flex-wrap:wrap; max-width:370px; justify-content:center; }.footer-links a { color:#677587; font-size:11px; }.footer-place { color:var(--navy); font-size:11px; }.footer-place span { color:var(--gold); border:1px solid var(--gold); padding:5px; margin-left:7px; font-size:9px; }.footer-bottom { display:flex; justify-content:space-between; border-top:1px solid #d1d4d1; margin-top:40px; padding-top:18px; color:#929b9f; font-size:9px; }
@media (max-width:800px) { .section-wrap { width:min(100% - 40px, 600px); }.site-header { padding:0 20px; }.main-nav { display:none; position:absolute; top:78px; left:0; right:0; padding:20px; background:var(--cream); flex-direction:column; gap:20px; border-bottom:1px solid var(--line); }.main-nav.mobile-open { display:flex; }.header-cta { display:none; }.menu-button { display:block; }.hero { display:block; padding-top:75px; min-height:auto; }.hero h1 { font-size:54px; }.hero-art { margin-top:55px; height:365px; transform:scale(.85); transform-origin:top center; }.rates-section,.converter-section,.about-section,.location-section { padding:75px 0; }.section-heading { display:block; }.section-heading p { margin-top:22px; }.section-heading h2,h2 { font-size:42px; }.rate-foot { display:block; line-height:1.6; }.rate-foot span { margin-bottom:7px; }.converter-section,.about-section,.location-section { grid-template-columns:1fr; gap:45px; }.converter-intro { order:0; }.converter-card { padding:25px 20px; }.about-stamp { width:145px;height:145px; margin:0 auto; }.steps-section { padding:75px 0; }.steps-grid { grid-template-columns:1fr; }.location-section { gap:35px; }.map-card { height:290px; }.contact-section { display:block; padding:55px 28px; }.contact-list { margin-top:38px; }.final-cta { display:block; padding:70px 0; }.final-cta .hero-actions { margin-top:28px; }.footer-inner { flex-direction:column; gap:30px; }.footer-links { justify-content:flex-start; }.footer-bottom { flex-direction:column; gap:10px; }.select-line { gap:6px; }.converter-card select { font-size:11px; padding:0 7px; } }
@media (max-width:430px) { .hero h1 { font-size:47px; }.hero-art { margin-left:-32px; margin-right:-32px; }.rates-panel-head,.rate-row { padding-inline:14px; }.rate-foot { padding-inline:14px; }.rate-row { grid-template-columns:1.5fr .6fr .6fr; }.currency-name strong { font-size:11px; }.checks { grid-template-columns:1fr; }.contact-section h2 { font-size:40px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }