/* Medieval Dynasty Companion — official public presentation.
   Original vector / CSS visual language; no game assets, no JS, no tracking. */
:root{--bg:#101b19;--ink:#f5f0e4;--muted:#c5c9be;--low:#aeb9ac;--gold:#dcb77d;--gold2:#f3d5a3;--edge:rgba(230,220,187,.17);--forest:#162522;--surface:#1b3029;--wrap:1180px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;min-width:320px;color:var(--ink);background:var(--bg);font:400 16px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:5px;border-radius:3px}
::selection{background:var(--gold);color:#15251d}
p,h1,h2,h3{margin-top:0}
.container{width:min(var(--wrap),calc(100% - 88px));margin-inline:auto}
.skip{position:fixed;z-index:100;top:8px;left:8px;padding:10px 16px;color:#101b19;background:var(--gold);transform:translateY(-150%)}
.skip:focus{transform:translateY(0)}
.masthead{position:relative;z-index:2;border-bottom:1px solid var(--edge);background:#101b19}
.masthead-inner{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.site-mark{font-size:22px;letter-spacing:-.07em;font-weight:900;display:inline-flex;align-items:center;gap:10px;line-height:1}
.site-symbol{display:grid;place-items:center;width:32px;height:32px;border:2px solid var(--gold);font:800 18px Arial,sans-serif;color:var(--gold);border-radius:5px}
.site-dot{color:var(--gold);margin-left:-9px}
.desktop-nav{display:flex;gap:30px;font-size:12px;letter-spacing:.025em;font-weight:650}
.desktop-nav a{color:#c9d1c8;transition:color .2s}.desktop-nav a:hover{color:var(--gold)}
.nav-action{font-size:12px;font-weight:800;border-bottom:1px solid var(--gold);padding:10px 0;white-space:nowrap}
.nav-action span{color:var(--gold);margin-left:8px}
.hero{position:relative;overflow:hidden;background:radial-gradient(ellipse at 85% 45%,rgba(67,104,77,.4),transparent 48%),linear-gradient(133deg,#111d1b,#1b2b24 75%);isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background-image:linear-gradient(90deg,transparent 99%,#fff 100%),linear-gradient(transparent 99%,#fff 100%);background-size:70px 70px;mask-image:linear-gradient(to bottom,#000,transparent 80%)}
.hero-sky{position:absolute;inset:0;overflow:hidden;z-index:-1}
.hero-orb{position:absolute;width:390px;aspect-ratio:1;border:1px solid rgba(232,206,143,.20);border-radius:50%;right:8%;top:14%;box-shadow:0 0 0 65px rgba(232,206,143,.026),0 0 0 135px rgba(232,206,143,.018)}
.hero-hill{position:absolute;bottom:18px;height:300px;background:#14251e;opacity:.4;filter:blur(1px);clip-path:polygon(0 100%,0 83%,13% 72%,25% 81%,34% 57%,46% 78%,58% 38%,72% 75%,80% 52%,100% 83%,100% 100%)}
.hill-a{width:90%;right:-10%;transform:translateY(110px)}.hill-b{width:80%;right:-16%;bottom:-15px;opacity:.6;background:#0c1916;transform:translateY(130px)}.hill-c{width:75%;left:-15%;opacity:.22;transform:translateY(70px)}
.hero-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:8%;align-items:center;min-height:675px;padding:82px 0 82px}
.hero-copy{position:relative;z-index:1}
.eyebrow,.section-label,.category,.feature-no{letter-spacing:.18em;font-size:11px;font-weight:800}
.eyebrow{display:flex;align-items:center;gap:14px;color:var(--gold2);margin-bottom:29px}
.pulse{display:inline-block;width:8px;height:8px;background:var(--gold);border-radius:50%;box-shadow:0 0 0 6px rgba(220,183,125,.12);flex:0 0 auto}
.hero-suptitle{font-size:12px;letter-spacing:.23em;color:#bfcabe;font-weight:700;margin-bottom:14px}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:500;letter-spacing:-.048em}
h1{font-size:clamp(58px,6vw,87px);line-height:1.08;margin-bottom:28px}
h1 em,h2 em{font-style:italic;color:var(--gold2)}
.hero-lead{font-size:17px;max-width:610px;line-height:1.85;color:#cfd8ce}
.hero-lead strong{color:#fff}
.hero-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:29px}
.button{min-height:52px;display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;gap:19px;font-size:12px;font-weight:800;border:1px solid transparent;border-radius:5px;transition:transform .2s,background .2s,border-color .2s}
.button:hover{transform:translateY(-2px)}
.button-primary{background:var(--gold2);color:#17231b}.button-primary:hover{background:#ffe0a4}
.button-outline{border-color:rgba(221,208,179,.43);background:rgba(0,0,0,.09);color:#f5eee1}.button-outline:hover{border-color:var(--gold)}
.button span{font-size:18px;font-weight:400}
.hero-small{color:#aeb9ac;font-size:12px;max-width:600px;line-height:1.7;margin:25px 0 0}
.device-showcase{position:relative;width:100%;max-width:420px;margin:20px auto 0;text-align:center}
.device-halo{position:absolute;z-index:-1;inset:8% -17%;border:1px solid rgba(224,200,151,.25);border-radius:50%;transform:rotate(-19deg);aspect-ratio:1}
.device{width:min(100%,340px);margin-inline:auto;text-align:left;padding:18px 19px 0;border:8px solid #0a1411;border-radius:34px;background:linear-gradient(160deg,#243b31 1%,#12211c 65%);box-shadow:0 25px 70px rgba(0,0,0,.42),0 0 0 1px rgba(228,200,143,.45),inset 0 0 0 1px #5c7458}
.device-top{display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#ccb98a;letter-spacing:.15em;font-weight:900;padding:6px 2px 20px;border-bottom:1px solid rgba(228,212,169,.14)}
.device-top i{font-size:20px;font-style:normal;color:var(--gold)}
.device-app-title{display:flex;flex-direction:column;padding:19px 2px 12px;gap:7px}.device-app-title small{letter-spacing:.13em;color:#cab78e;font-size:8px;font-weight:800}.device-app-title strong{font:500 22px/1.25 Georgia,serif;color:#fff2d9;max-width:250px}
.device-search{border:1px solid rgba(241,221,173,.25);border-radius:9px;padding:12px 10px;background:#101f1a;font-size:11px;color:#b9c4b4}
.device-search span{font-size:20px;line-height:0;color:var(--gold);margin-right:9px}
.device-pills{display:flex;gap:5px;padding:13px 0 12px;flex-wrap:wrap}.device-pills span{border-radius:15px;padding:5px 9px;font-size:9px;border:1px solid #446052;color:#dee3d3}.device-pills span:first-child{background:#d3b483;border-color:#d3b483;color:#152219;font-weight:800}
.device-entry{display:flex;gap:10px;align-items:center;padding:13px 0;border-bottom:1px solid rgba(225,215,187,.12)}.device-entry-icon{display:grid;place-items:center;background:#314739;border:1px solid #49604c;border-radius:9px;width:38px;height:38px;color:#e2c28e;font-size:20px;flex:0 0 auto}.device-entry>span:nth-child(2){display:flex;flex-direction:column;gap:1px;flex:1}.device-entry b{font-size:11px;color:#f4e9d6}.device-entry small{font-size:9px;color:#b6c3b6}.device-entry i{font:normal 22px Georgia,serif;color:#cbaa73}
.device-tabbar{display:flex;justify-content:space-around;gap:7px;margin-top:22px;padding:12px 0 17px;border-top:1px solid rgba(220,202,159,.21);color:#a4b4aa}.device-tabbar span{font-size:17px;line-height:1;display:flex;align-items:center;flex-direction:column;gap:5px}.device-tabbar small{font:600 8px Arial,sans-serif}.device-tabbar .selected{color:#e8ce99}
.device-showcase figcaption{font-size:10px;line-height:1.6;color:#a9b3a3;margin-top:14px;padding:0 12px}
.quickproof{display:flex;justify-content:space-between;gap:20px;padding:23px 0;border-top:1px solid rgba(229,216,178,.17);font-size:10px;font-weight:800;letter-spacing:.16em;color:#d9d8bf}
.section-space{padding-top:112px;padding-bottom:112px}
.section-label{display:flex;align-items:center;gap:14px;color:#e7c38b;margin-bottom:39px}
.section-label span:first-child{display:grid;place-items:center;width:31px;height:31px;font-size:10px;border:1px solid rgba(231,195,139,.43);border-radius:50%}
h2{font-size:clamp(42px,4.4vw,65px);line-height:1.17;margin-bottom:26px}
.intro-grid{display:grid;grid-template-columns:1fr .9fr;gap:12%}
.intro-grid p{color:#bdcbbf}
.large{font-size:19px!important;color:#ebe9db!important;line-height:1.7}
.free{background:linear-gradient(180deg,#182b26,#14231f)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:65px;margin-bottom:40px}.section-heading>p{max-width:355px;color:#c0cbbf;margin-bottom:15px}
.category{color:var(--gold2);margin-bottom:15px}
.features-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid rgba(221,199,156,.17);border-bottom:none}
.feature{min-height:290px;padding:28px 28px 34px;border-right:1px solid var(--edge);border-bottom:1px solid var(--edge);background:rgba(3,8,6,.10)}
.feature:nth-child(3n){border-right:none}
.feature-no{color:#c5aa81;font-size:10px}
.feature-symbol{display:block;font:normal 35px/1 Georgia,serif;color:#e6c891;margin:28px 0 20px}
h3{font-size:26px;line-height:1.25;margin-bottom:13px}
.feature p{color:#c1cec4;font-size:14px;line-height:1.75;margin-bottom:0}
.map-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:10%;align-items:center}
.map-copy p:not(.category){color:#becbbf}
.mini-note{display:flex;gap:13px;padding:20px 0;margin-top:23px;border-top:1px solid var(--edge);font-size:13px;line-height:1.7;color:#d8c8a8}.mini-note>span:first-child{font-size:23px;color:var(--gold)}
.map-art{position:relative;min-height:460px;background:radial-gradient(ellipse at 45% 35%,#385a48,#223e31 64%,#193028);overflow:hidden;border:1px solid rgba(222,188,124,.33);box-shadow:26px 26px 0 -12px #101b19,26px 26px 0 -11px rgba(226,194,141,.19);isolation:isolate}
.map-art::before{content:"";position:absolute;inset:0;opacity:.44;background:repeating-radial-gradient(ellipse at 32% 22%,transparent 0 19px,rgba(207,218,165,.16) 20px 21px,transparent 22px 32px),repeating-radial-gradient(ellipse at 95% 75%,transparent 0 25px,rgba(207,218,165,.15) 26px 27px,transparent 28px 46px)}
.map-art-grid{position:absolute;inset:0;opacity:.26;background:linear-gradient(90deg,rgba(227,215,178,.19) 1px,transparent 1px),linear-gradient(rgba(227,215,178,.19) 1px,transparent 1px);background-size:44px 44px}
.map-art-water{position:absolute;width:34%;height:135%;top:-15%;left:49%;background:#497d77;transform:rotate(24deg);filter:blur(12px);border-radius:70% 24% 67% 36%;opacity:.62}
.map-art-route{position:absolute;width:65%;height:90%;top:7%;left:7%;border:3px dashed rgba(255,230,164,.68);transform:rotate(-32deg);border-radius:45% 65% 22% 59%}
.map-art-point{position:absolute;z-index:2;display:flex;align-items:center;gap:9px;font-size:10px;font-weight:900;letter-spacing:.13em;background:#14261d;padding:9px 13px;border:1px solid rgba(230,203,157,.5);box-shadow:0 5px 20px #0a1b1c6b}.map-art-point i{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--gold)}.p-one{left:18%;top:31%}.p-two{right:10%;bottom:27%}
.map-art-legend{position:absolute;bottom:20px;left:20px;right:20px;display:flex;justify-content:space-between;font:800 10px Arial,sans-serif;letter-spacing:.18em;color:#f5e8c9;padding-top:14px;border-top:1px solid rgba(238,221,181,.38)}
.map-art-compass{position:absolute;top:20px;right:20px;border-radius:50%;border:1px solid rgba(238,218,179,.7);width:46px;height:46px;display:grid;place-items:center;color:#ffe0a7;font:800 12px Arial,sans-serif}
.premium{background:linear-gradient(160deg,#29281e,#23251e 58%,#1a231f)}
.premium-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:30px}
.coming-soon{font-size:11px;color:#eed3a5;letter-spacing:.13em;padding:10px 14px;border:1px solid #a48a5b;white-space:nowrap}.coming-soon span{padding-left:10px}
.premium-intro{max-width:760px;color:#d2d3c5;font-size:17px;margin:4px 0 40px}.premium-intro strong{color:#fff2d7}
.premium-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(231,204,152,.23);border:1px solid rgba(231,204,152,.23)}
.premium-grid article{background:#262d26;padding:35px;min-height:225px}.premium-grid article>span{display:block;color:var(--gold);font:600 13px Georgia,serif;margin-bottom:20px}.premium-grid h3{font-size:26px}.premium-grid p{color:#ccd0c5;font-size:14px;margin-bottom:0}
.premium-note{margin-top:24px;border:1px solid #887653;background:rgba(174,145,93,.11);display:flex;gap:23px;padding:23px}.premium-note-icon{font:40px/1 Georgia,serif;color:var(--gold2)}.premium-note strong{color:#ffe7ba}.premium-note p{margin:5px 0 0;color:#cbd0c5;font-size:14px}
.how-grid{display:grid;grid-template-columns:1fr 1fr;gap:12%}.how-grid>div>p{color:#bfcbbd}
.steps>div{display:grid;grid-template-columns:44px 1fr;gap:20px;padding:19px 0;border-bottom:1px solid var(--edge)}
.steps>div:first-child{padding-top:0}.steps span{font:18px Georgia,serif;color:var(--gold)}.steps p{font-size:14px;color:#bec9bb;margin:0}.steps strong{color:#fff3dc;font-size:16px}
.faq{background:#152620}
.faq-layout{display:grid;grid-template-columns:.65fr 1.35fr;gap:12%}
.faq-items{border-top:1px solid rgba(228,207,162,.24)}
.faq-items details{border-bottom:1px solid rgba(228,207,162,.24);padding:21px 0}
.faq-items summary{list-style:none;cursor:pointer;color:#fff2df;font-size:16px;font-weight:700;display:flex;gap:30px;justify-content:space-between;align-items:center}
.faq-items summary::-webkit-details-marker{display:none}
.faq-items summary::after{content:"+";font-size:23px;color:var(--gold);font-weight:300}
.faq-items details[open] summary::after{content:"−"}
.faq-items details p{color:#becfc2;font-size:14px;margin:15px 0 0}
.availability{background:linear-gradient(110deg,#3b3a2a,#1b2b24);border-top:1px solid rgba(228,190,133,.3)}
.availability-inner{display:flex;align-items:center;justify-content:space-between;gap:60px}.availability-inner>div{max-width:770px}.availability-inner p:not(.category){color:#d6d9ca;max-width:760px}.availability-notice{display:inline-flex;align-items:center;gap:14px;border:1px solid rgba(246,214,160,.53);padding:12px 16px;margin-top:14px;font-size:12px;font-weight:800;color:#f8daa1}
.footer{padding:55px 0 28px;background:#0b1412}
.footer-inner{display:flex;justify-content:space-between;gap:50px}.footer-inner p{color:#a8b5a8;font-size:12px;max-width:600px;line-height:1.8;margin:19px 0 0}
.footer-links{display:flex;gap:20px;flex-wrap:wrap;align-content:start;color:#d6d8c9;font-size:12px}.footer-links a:hover{color:var(--gold)}
.footer-fine{margin-top:42px;border-top:1px solid var(--edge);padding-top:24px;font-size:11px;line-height:1.8;color:#89978b}
@media(max-width:1020px){
 .container{width:min(var(--wrap),calc(100% - 52px))}
 .desktop-nav{gap:17px;font-size:11px}
 .hero-layout{gap:3%;grid-template-columns:1.08fr .92fr}
 h1{font-size:clamp(49px,6vw,70px)}
 .hero-lead{font-size:15px}
 .device{max-width:290px}
 .features-grid{grid-template-columns:repeat(2,1fr)}.feature:nth-child(3n){border-right:1px solid var(--edge)}.feature:nth-child(2n){border-right:none}
}
@media(max-width:720px){
 html{scroll-padding-top:70px}
 .container{width:calc(100% - 34px)}
 .masthead-inner{min-height:74px;flex-wrap:wrap;gap:8px}.site-mark{font-size:20px}.desktop-nav{display:none}.nav-action{font-size:11px}
 .hero-layout{display:flex;flex-direction:column;align-items:stretch;gap:45px;min-height:0;padding:66px 0 45px}
 .hero-suptitle{font-size:10px}.eyebrow{font-size:9px;letter-spacing:.105em;line-height:1.5}.hero-copy{text-align:left}
 h1{font-size:clamp(47px,12vw,66px)}
 h2{font-size:clamp(39px,9vw,54px)}
 .hero-lead{font-size:15px}
 .hero-actions{flex-direction:column;align-items:stretch}.button{width:100%;text-align:center}
 .device-showcase{max-width:360px}.device{width:280px}.device-halo{inset:0}
 .quickproof{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:20px 0;font-size:9px;line-height:1.5}
 .section-space{padding-top:70px;padding-bottom:70px}
 .section-label{margin-bottom:27px}
 .intro-grid,.map-layout,.how-grid,.faq-layout{grid-template-columns:1fr;gap:27px}
 .section-heading,.premium-heading{display:block}.section-heading>p{margin-top:12px}
 .features-grid{grid-template-columns:1fr}.feature{min-height:0;padding:25px}.feature:nth-child(n){border-right:none}
 .feature-symbol{margin:19px 0 13px}.feature h3{font-size:24px}
 .map-art{min-height:350px;box-shadow:none}
 .premium-grid{grid-template-columns:1fr}.premium-grid article{padding:27px;min-height:0}
 .premium-intro{font-size:15px}
 .coming-soon{display:inline-block;margin-bottom:20px}
 .faq-layout{gap:5px}
 .availability-inner{display:block}.availability-inner>.button{margin-top:28px;width:100%}
 .footer-inner{display:block}.footer-links{margin-top:25px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}a,.button{transition:none}}