:root { --ink:#0a0a09; --paper:#eeeadd; --paper-clean:#f7f4ea; --red:#d92c21; --grey:#69675f; --line:rgba(10,10,9,.22); --shadow:8px 8px 0 #0a0a09; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial,Helvetica,sans-serif; line-height:1.48; -webkit-font-smoothing:antialiased; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; z-index:100; opacity:.17; mix-blend-mode:multiply; background-image:repeating-radial-gradient(circle at 18% 30%,transparent 0 2px,rgba(0,0,0,.11) 3px,transparent 4px),url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.74' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E"); background-size:8px 8px,210px 210px; }
a { color:inherit; }
button,input,select { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.skip-link { position:absolute; left:-9999px; }
.skip-link:focus { left:1rem; top:1rem; z-index:101; background:#fff; color:#000; padding:.75rem 1rem; border:2px solid; }

.hero { min-height:94vh; padding:0 clamp(1rem,4vw,4.5rem) 3.5rem; position:relative; overflow:hidden; background:linear-gradient(92deg,transparent 0 71%,rgba(10,10,9,.07) 71% 71.3%,transparent 71.3%),var(--paper); }
.hero::before { content:"MUAY THAI / THAILAND / MUAY THAI / THAILAND"; position:absolute; left:-4rem; bottom:2rem; color:transparent; -webkit-text-stroke:1px rgba(10,10,9,.12); font:900 clamp(4rem,12vw,11rem)/.8 Impact,"Arial Black",sans-serif; white-space:nowrap; transform:rotate(-4deg); }
.topbar { height:78px; display:flex; align-items:center; justify-content:space-between; border-bottom:3px solid var(--ink); position:relative; z-index:3; }
.brand { font:900 .9rem/1 Impact,"Arial Black",sans-serif; letter-spacing:.17em; text-decoration:none; white-space:nowrap; }
.brand span { color:var(--red); }
.small-link { font-size:.78rem; font-weight:900; text-decoration:none; border-bottom:2px solid; }
.hero-grid { max-width:1220px; margin:0 auto; min-height:calc(94vh - 78px); display:grid; grid-template-columns:1.12fr .88fr; gap:6vw; align-items:center; position:relative; z-index:2; }
.hero-copy { padding:5rem 0; }
.eyebrow,.kicker { text-transform:uppercase; letter-spacing:.14em; font-size:.7rem; font-weight:900; color:var(--red); }
.eyebrow { display:inline-flex; align-items:center; gap:.65rem; padding:.42rem .65rem; border:2px solid var(--red); transform:rotate(-1deg); background:var(--paper); }
.eyebrow span { width:24px; height:3px; background:var(--red); }
h1,h2 { margin:0; font-family:Impact,"Arial Black",Arial,sans-serif; font-weight:900; line-height:.88; letter-spacing:-.025em; text-transform:uppercase; }
h1 { font-size:clamp(4.1rem,8.7vw,8.4rem); max-width:930px; }
h1 em { color:var(--red); font-style:normal; display:inline-block; transform:rotate(-2deg); text-decoration:underline .08em; text-underline-offset:.08em; }
.lead { max-width:650px; font-size:clamp(1rem,2vw,1.22rem); font-weight:650; margin:2rem 0 0; padding-left:1rem; border-left:5px solid var(--ink); }
.hero-actions { display:flex; flex-wrap:wrap; gap:.85rem; margin-top:2rem; }
.button { min-height:50px; display:inline-flex; align-items:center; justify-content:center; padding:.85rem 1.2rem; border:3px solid var(--ink); border-radius:0; font-weight:900; text-transform:uppercase; letter-spacing:.045em; text-decoration:none; cursor:pointer; transition:transform .15s ease,box-shadow .15s ease; }
.button:hover { transform:translate(-2px,-2px); box-shadow:5px 5px 0 var(--ink); }
.button.primary { background:var(--red); color:#fff; }
.button.ghost { background:transparent; color:var(--ink); }
.micro { color:var(--grey); font-size:.76rem; max-width:520px; margin-top:1.25rem; }

.fight-card { aspect-ratio:.78; max-height:620px; border:5px solid var(--ink); position:relative; overflow:hidden; background:#d4d0c3; box-shadow:12px 12px 0 var(--ink); transform:rotate(1.2deg); filter:contrast(1.08); }
.fight-card::before { content:"RAW TRAINING"; position:absolute; z-index:5; top:1rem; right:-2.2rem; color:#fff; background:var(--red); padding:.45rem 2.5rem; font:900 .72rem/1 Arial,sans-serif; letter-spacing:.13em; transform:rotate(8deg); }
.fight-card::after { content:""; position:absolute; inset:0; z-index:4; background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.08) 3px 4px); mix-blend-mode:multiply; }
.sun { position:absolute; width:58%; aspect-ratio:1; border-radius:50%; background:var(--red); top:14%; left:21%; box-shadow:0 0 0 8px rgba(217,44,33,.16); }
.ring-rope { position:absolute; left:-5%; width:110%; height:7px; background:var(--ink); z-index:2; }
.rope-one { top:64%; transform:rotate(-2deg); }
.rope-two { top:75%; transform:rotate(2deg); }
.fighter { position:absolute; z-index:3; bottom:14%; width:22%; height:36%; border-radius:46% 46% 12% 12%; background:var(--ink); }
.fighter::before { content:""; position:absolute; width:58%; aspect-ratio:.85; border-radius:45%; background:var(--ink); left:21%; top:-25%; }
.fighter span { position:absolute; width:78%; height:11%; background:var(--ink); top:20%; border-radius:999px; }
.fighter-one { left:27%; transform:rotate(8deg); }
.fighter-one span { right:-55%; transform:rotate(-18deg); transform-origin:left center; }
.fighter-two { right:22%; transform:rotate(-8deg); }
.fighter-two span { left:-55%; transform:rotate(18deg); transform-origin:right center; }
.fight-card p { position:absolute; z-index:6; margin:0; left:7%; bottom:5%; color:var(--ink); font-size:.66rem; letter-spacing:.18em; font-weight:900; }
.fight-card p strong { display:block; margin-top:.25rem; font:900 1.6rem/1 Impact,"Arial Black",sans-serif; letter-spacing:.08em; }

.intro-strip { display:grid; grid-template-columns:repeat(4,1fr); max-width:1200px; margin:-2.5rem auto 0; position:relative; z-index:5; background:var(--ink); color:#fff; border:3px solid var(--ink); box-shadow:7px 7px 0 var(--red); transform:rotate(-.3deg); }
.intro-strip div { display:flex; gap:.75rem; align-items:center; padding:1.15rem 1.4rem; border-right:1px solid rgba(255,255,255,.35); }
.intro-strip div:last-child { border:0; }
.intro-strip b { color:var(--red); font:900 1rem/1 Impact,sans-serif; }
.intro-strip span { font-weight:900; text-transform:uppercase; font-size:.82rem; }

.section { max-width:1200px; margin:0 auto; padding:8rem 1.5rem; }
.section.alternate { max-width:none; padding-left:max(1.5rem,calc((100vw - 1200px)/2 + 1.5rem)); padding-right:max(1.5rem,calc((100vw - 1200px)/2 + 1.5rem)); background:var(--ink); color:#fff; border-top:8px solid var(--red); border-bottom:8px solid var(--red); }
.section-heading { max-width:790px; margin-bottom:3rem; }
.section-heading h2,.before-booking h2 { font-size:clamp(3rem,6.7vw,6rem); }
.section-heading>p:last-child { color:var(--grey); max-width:660px; font-size:1.03rem; font-weight:600; }
.alternate .section-heading>p:last-child { color:#bcb8ae; }
.calculator-layout,.prompt-layout { display:grid; grid-template-columns:1.25fr .75fr; gap:1.4rem; align-items:start; }
.panel { background:var(--paper-clean); border:3px solid var(--ink); box-shadow:var(--shadow); }
.form-panel { padding:clamp(1.2rem,3vw,2rem); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-grid label { display:flex; flex-direction:column; gap:.45rem; color:var(--grey); font-size:.72rem; text-transform:uppercase; letter-spacing:.07em; font-weight:900; }
.form-grid label span { display:flex; align-items:center; gap:.45rem; color:var(--ink); background:#fff; border:2px solid var(--ink); padding:.18rem .75rem; text-transform:none; box-shadow:3px 3px 0 rgba(10,10,9,.18); }
.form-grid input,.form-grid select { width:100%; background:#fff; color:var(--ink); border:2px solid var(--ink); border-radius:0; padding:.88rem .9rem; outline:none; font-weight:800; }
.form-grid label span input { border:0; box-shadow:none; padding:.68rem 0; }
.form-grid input:focus,.form-grid select:focus { outline:3px solid var(--red); outline-offset:2px; }
.form-grid .wide { grid-column:1/-1; }
.budget-style { grid-column:1/-1; border:0; padding:0; margin:.35rem 0; display:grid; grid-template-columns:repeat(3,1fr); gap:.65rem; }
.budget-style legend { color:var(--grey); font-size:.72rem; text-transform:uppercase; letter-spacing:.07em; font-weight:900; margin-bottom:.55rem; }
.budget-style label { position:relative; cursor:pointer; }
.budget-style input { position:absolute; opacity:0; pointer-events:none; }
.budget-style label>span { min-height:92px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:.8rem; border:2px solid var(--ink); box-shadow:3px 3px 0 rgba(10,10,9,.18); background:#fff; color:var(--ink); }
.budget-style label>span small { color:var(--grey); font-size:.68rem; line-height:1.35; }
.budget-style input:checked+span { color:#fff; background:var(--ink); box-shadow:5px 5px 0 var(--red); }
.budget-style input:checked+span small { color:#c9c5bb; }
.switch-row { flex-direction:row!important; align-items:center; background:#ded9ca; border:2px dashed var(--ink); padding:.8rem; cursor:pointer; }
.switch-row>input { width:22px; height:22px; flex:0 0 auto; accent-color:var(--red); }
.switch-row>span { display:grid!important; background:transparent!important; border:0!important; box-shadow:none!important; padding:0!important; gap:.1rem!important; }
.switch-row small { color:var(--grey); font-size:.7rem; text-transform:none; letter-spacing:0; }
.estimate-note { color:var(--grey); font-size:.72rem; margin:1rem 0 0; }
.text-button { border:0; border-bottom:2px solid var(--red); background:transparent; color:var(--red); margin-top:1.2rem; padding:0; cursor:pointer; font-weight:900; text-transform:uppercase; }
.total-card { padding:2rem; position:sticky; top:1rem; background:var(--ink); color:#fff; box-shadow:8px 8px 0 var(--red); }
.total-card>p:first-child { color:#aaa69d; margin-top:0; text-transform:uppercase; font-size:.75rem; letter-spacing:.1em; font-weight:900; }
.total-card>strong { display:block; font:900 clamp(3.6rem,7vw,6.3rem)/.9 Impact,"Arial Black",sans-serif; color:#fff; margin-bottom:2rem; transform:scaleX(.92); transform-origin:left; }
.thb-total { color:#aaa69d; margin:-1.35rem 0 1.35rem; font-weight:900; }
.flight-excluded { display:inline-block; margin:-.7rem 0 1.2rem; padding:.3rem .5rem; color:#fff; background:var(--red); font-size:.68rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em; transform:rotate(-1deg); }
.cost-row { display:flex; justify-content:space-between; gap:1rem; padding:.82rem 0; border-bottom:1px dashed rgba(255,255,255,.35); color:#bcb8ae; }
.cost-row>span { display:grid; }
.cost-row small { color:#75726b; font-size:.65rem; }
.cost-row b { color:#fff; }
.cost-row.emphasized { color:#fff; border-bottom:0; }
.button.full { width:100%; margin-top:1.5rem; }
.status { min-height:1.2em; color:var(--red); font-size:.78rem; font-weight:800; margin-bottom:0; }
.reality-note { margin-top:1.4rem; padding:1.35rem 1.5rem; border:3px solid var(--ink); background:#fff; display:grid; grid-template-columns:180px 1fr; gap:1.2rem; box-shadow:5px 5px 0 rgba(10,10,9,.22); transform:rotate(.25deg); }
.reality-note span { color:var(--red); font-weight:900; text-transform:uppercase; font-size:.72rem; letter-spacing:.08em; }
.reality-note p { margin:0; }

.gym-layout { display:grid; grid-template-columns:1.1fr .9fr; gap:2rem; }
.checklist { display:grid; gap:.75rem; }
.checklist label { display:flex; gap:1rem; align-items:flex-start; padding:1rem; border:2px solid rgba(255,255,255,.55); cursor:pointer; background:#0f0f0e; transition:border .15s,transform .15s; }
.checklist label:nth-child(even) { transform:rotate(.15deg); }
.checklist label:has(input:checked) { border-color:var(--red); background:#1a0c0a; }
.checklist input { width:22px; height:22px; margin-top:.1rem; accent-color:var(--red); }
.checklist span { display:grid; gap:.2rem; }
.checklist small { color:#aaa69d; }
.score-card { min-height:100%; padding:2rem; background:#fff; color:var(--ink); display:flex; flex-direction:column; justify-content:center; border:5px solid #fff; outline:3px solid var(--red); outline-offset:-12px; transform:rotate(-.6deg); }
.score-ring { width:160px; aspect-ratio:1; border:14px solid #d6d2c8; border-top-color:var(--red); border-radius:50%; display:flex; align-items:baseline; justify-content:center; padding-top:43px; transform:rotate(-10deg); }
.score-ring strong,.score-ring span { transform:rotate(10deg); }
.score-ring strong { font:900 4.2rem/1 Impact,sans-serif; }
.score-ring span { color:var(--grey); }
.score-card h3 { font:900 2.2rem/1 Impact,sans-serif; text-transform:uppercase; margin:1.5rem 0 .4rem; }
.score-card>p { color:#58564f; margin-top:0; }
.red-flag { background:var(--ink); color:#fff; padding:1rem; margin-top:1rem; }
.red-flag b { color:var(--red); }

.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:3px solid var(--ink); box-shadow:7px 7px 0 var(--ink); }
.steps article { background:var(--paper-clean); padding:1.55rem; min-height:260px; border-right:2px dashed var(--ink); }
.steps article:last-child { border-right:0; }
.steps article:nth-child(2),.steps article:nth-child(4) { background:#ded9ca; }
.steps span { display:inline-flex; color:#fff; background:var(--red); font:900 1rem/1 Impact,sans-serif; padding:.45rem .55rem; transform:rotate(-3deg); }
.steps h3 { font:900 1.5rem/1 Impact,sans-serif; text-transform:uppercase; margin-top:3rem; }
.steps p { color:var(--grey); }
.flight-actions { display:flex; flex-wrap:wrap; gap:1rem 1.5rem; align-items:center; margin-top:1.5rem; }
.source-link { color:var(--grey); font-size:.8rem; font-weight:700; }
.source-link:hover { color:var(--red); }

.prompt-section { border-top:3px solid var(--ink); }
.prompt-layout { grid-template-columns:.85fr 1.15fr; }
.prompt-card { overflow:hidden; background:var(--ink); color:#fff; box-shadow:8px 8px 0 var(--red); }
.prompt-top { display:flex; align-items:center; justify-content:space-between; padding:1rem 1.25rem; border-bottom:2px dashed rgba(255,255,255,.45); color:#bdb8ae; font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; font-weight:900; }
.prompt-top button { border:2px solid #fff; background:transparent; color:#fff; padding:.45rem .8rem; cursor:pointer; font-weight:900; text-transform:uppercase; }
.prompt-top button:hover { background:var(--red); }
pre { margin:0; padding:1.5rem; white-space:pre-wrap; word-break:break-word; color:#dedbd2; font:.88rem/1.65 "Courier New",monospace; max-height:520px; overflow:auto; }
.prompt-card .status { padding:0 1.5rem 1.2rem; }

.before-booking { max-width:1200px; margin:0 auto 8rem; padding:3rem; border:5px solid var(--ink); background:var(--red); color:#fff; display:grid; grid-template-columns:.9fr 1.1fr; gap:3rem; box-shadow:12px 12px 0 var(--ink); transform:rotate(.25deg); }
.before-booking .kicker { color:var(--ink); }
.before-booking ul { margin:0; padding-left:1.25rem; }
.before-booking li { padding:.7rem 0; border-bottom:1px dashed rgba(255,255,255,.55); font-weight:800; }
.before-booking li:last-child { border:0; }
footer { border-top:5px solid var(--ink); padding:3rem max(1.5rem,calc((100vw - 1200px)/2 + 1.5rem)); display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center; background:var(--ink); color:#fff; }
footer p { color:#aaa69d; margin:.5rem 0 0; }
footer>a { font-weight:900; color:#fff; text-decoration-color:var(--red); text-decoration-thickness:3px; }
footer small { grid-column:1/-1; color:#76736c; max-width:850px; }

@media (max-width:900px) {
  .hero { min-height:auto; }
  .hero-grid { grid-template-columns:1fr; }
  .hero-copy { padding:4rem 0 1rem; }
  .fight-card { width:min(100%,520px); margin:0 auto 2rem; max-height:none; }
  .intro-strip { margin:0 1rem; }
  .calculator-layout,.gym-layout,.prompt-layout,.before-booking { grid-template-columns:1fr; }
  .total-card { position:static; }
  .steps { grid-template-columns:1fr 1fr; }
  .steps article:nth-child(2) { border-right:0; }
}
@media (max-width:600px) {
  .hero { padding:0 1rem 2.5rem; }
  .topbar { height:68px; }
  .hero-grid { min-height:auto; }
  .hero-copy { padding-top:3.2rem; }
  h1 { font-size:clamp(3.65rem,18vw,5.25rem); }
  .lead { font-size:.98rem; }
  .hero-actions .button { width:100%; }
  .fight-card { box-shadow:7px 7px 0 var(--ink); }
  .intro-strip { grid-template-columns:1fr 1fr; box-shadow:5px 5px 0 var(--red); }
  .intro-strip div { padding:.82rem .9rem; border-bottom:1px solid rgba(255,255,255,.3); }
  .section { padding:5.2rem 1rem; }
  .section.alternate { padding-left:1rem; padding-right:1rem; }
  .section-heading h2,.before-booking h2 { font-size:3.4rem; }
  .form-grid { grid-template-columns:1fr; }
  .form-grid .wide { grid-column:auto; }
  .budget-style { grid-template-columns:1fr; }
  .budget-style label>span { min-height:74px; }
  .reality-note { grid-template-columns:1fr; }
  .steps { grid-template-columns:1fr; box-shadow:5px 5px 0 var(--ink); }
  .steps article,.steps article:nth-child(2) { min-height:auto; border-right:0; border-bottom:2px dashed var(--ink); }
  .steps article:last-child { border-bottom:0; }
  .steps h3 { margin-top:2rem; }
  .before-booking { margin:0 1rem 5rem; padding:2rem 1.3rem; box-shadow:7px 7px 0 var(--ink); }
  footer { grid-template-columns:1fr; }
  footer small { grid-column:auto; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }
