@font-face{font-family:"Alfa Slab One";src:url("/fonts/alfa-slab-one.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Sans";src:url("/fonts/noto-sans.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Su Arrows";src:url("/fonts/arrows.woff2") format("woff2");font-display:swap}

:root{
  --su-ember:#140400;
  --su-ink:#0c0200;
  --su-wood:#2a0e08;
  --su-wood2:#3a160c;
  --su-rose:#3a1208;
  --su-orange:#f84800;
  --su-flame:#ff5a12;
  --su-gold:#ffd24a;
  --su-cream:#fff3c8;
  --su-maroon:#681000;
  --su-brass:#c4923a;
  --su-velvet:#4a0c08;
  --su-cta:#f84800;
  --su-cta-ink:#fff8e8;
  --su-line:rgba(255,210,74,.28);
  --su-max:1280px;
}
*{box-sizing:border-box}
html{background:var(--su-ink);color:var(--su-cream);font-family:"Noto Sans",system-ui,sans-serif;font-size:16px;line-height:1.55;-webkit-text-size-adjust:100%}
body{margin:0;background:
  radial-gradient(1200px 600px at 50% 120px,rgba(248,72,0,.22),transparent 60%),
  linear-gradient(180deg,#1a0600 0%,#140400 40%,#0c0200 100%)}
img{max-width:100%;height:auto;display:block}
a{color:var(--su-gold)}
a:hover{color:#ffe58a}
.su-skip{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
.su-skip:focus{left:12px;top:12px;width:auto;height:auto;padding:8px 12px;background:var(--su-gold);color:#1a0500;z-index:80}

/* ===== HEADER ===== */
.su-top{position:relative;z-index:20;display:flex;align-items:center;gap:14px;min-height:70px;padding:6px 18px 6px 14px;
  background:linear-gradient(180deg,#3a160c,#1e0a06);
  border-bottom:2px solid var(--su-brass);
  box-shadow:0 4px 16px #000, inset 0 -1px 0 #6a3a12}
.su-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex:0 0 auto}
.su-bead{width:52px;height:52px;flex:0 0 52px;filter:drop-shadow(0 2px 4px #000)}
.su-word{font-family:"Alfa Slab One",serif;font-size:48px;line-height:1;color:var(--su-gold);
  text-shadow:0 2px 0 #1a0500, 0 0 12px rgba(248,72,0,.4);letter-spacing:.01em}
.su-nav{display:flex;align-items:center;gap:7px;flex:1 1 auto;justify-content:center;flex-wrap:wrap}
.su-nav a{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 12px;border-radius:999px;
  background:linear-gradient(180deg,#4a1c0e,#2a0c08);border:1px solid #c4923a;color:var(--su-cream);
  text-decoration:none;font-weight:650;font-size:14px;letter-spacing:.02em;box-shadow:inset 0 1px 0 rgba(255,210,74,.25)}
.su-nav a:hover,.su-nav a[aria-current="page"]{background:linear-gradient(180deg,#f84800,#9a2a00);color:#fff8e8;border-color:#ffd24a}
.su-ico{width:16px;height:16px;fill:currentColor;flex:0 0 16px}
.su-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;
  background:linear-gradient(180deg,#ff7a1a,#f84800 55%,#c03000);color:var(--su-cta-ink);font-weight:800;font-size:16px;
  text-decoration:none;border:1px solid #ffd24a;box-shadow:0 0 16px rgba(248,72,0,.45), inset 0 1px 0 #ffc070;letter-spacing:.03em;
  text-transform:uppercase;white-space:nowrap}
.su-cta:hover{color:#fff;filter:brightness(1.08)}
.su-arr{font-family:"Su Arrows","Noto Sans",sans-serif;font-weight:400}
.su-top .su-cta{min-height:44px;padding:0 16px;font-size:15px}

.su-tick{height:26px;display:flex;align-items:center;justify-content:center;gap:16px;
  background:#1a0500;color:#ffd24a;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  border-bottom:1px solid rgba(196,146,58,.4);overflow:hidden;white-space:nowrap}

/* ===== FOLD: giant suanpan ===== */
.su-fold{position:relative;height:704px;max-height:calc(800px - 70px - 26px);padding:8px 14px 6px;
  background:
    radial-gradient(ellipse at 50% 100%,rgba(248,72,0,.25),transparent 55%),
    #140400}
.su-table{position:relative;height:100%;border-radius:8px;
  background:
    radial-gradient(ellipse at 50% 120%,rgba(248,72,0,.08),transparent 50%),
    linear-gradient(180deg,#3a0c08 0%,#2a0806 40%,#1a0402 100%);
  overflow:hidden}
.su-coins{position:absolute;bottom:0;width:240px;height:140px;pointer-events:none;z-index:4;object-fit:contain}
.su-coins-l{left:0}
.su-coins-r{right:0}

.su-frame{position:absolute;inset:8px 18px 10px;border-radius:16px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.4),transparent 7%,transparent 93%,rgba(0,0,0,.4)),
    repeating-linear-gradient(92deg,#241008 0 7px,#3a160c 7px 14px,#2e1008 14px 20px);
  border:9px solid #c4923a;
  box-shadow:inset 0 0 0 5px #6a3a12, inset 0 0 40px rgba(0,0,0,.45), 0 18px 40px #000, 0 0 60px rgba(248,72,0,.25);
  display:flex;flex-direction:column;overflow:visible}
.su-corner{position:absolute;width:28px;height:28px;background:
  linear-gradient(135deg,#ffe08a,#c4923a 40%,#6a3a12);border-radius:4px;z-index:6;
  box-shadow:0 0 0 2px #3a1a08, 0 2px 4px #000}
.su-corner-tl{top:-8px;left:-8px}
.su-corner-tr{top:-8px;right:-8px}
.su-corner-bl{bottom:-8px;left:-8px}
.su-corner-br{bottom:-8px;right:-8px}

.su-heaven{flex:0 0 148px;position:relative;margin:12px 28px 0}
.su-rod{position:absolute;left:0;right:0;height:10px;border-radius:6px;
  background:linear-gradient(180deg,#8a6230,#f0d888 40%,#c4923a 60%,#6a4018);
  box-shadow:0 2px 4px #000, 0 0 8px rgba(255,210,74,.3);top:50%;transform:translateY(-50%)}
.su-promo{position:absolute;top:50%;transform:translate(-50%,-50%);width:210px;height:138px;z-index:2;
  text-decoration:none;filter:drop-shadow(0 6px 8px #000)}
.su-promo img{width:100%;height:100%;object-fit:contain;border-radius:50%}
.su-p1{left:18%}
.su-p2{left:50%}
.su-p3{left:82%}

/* BEAM */
.su-beam{flex:0 0 148px;margin:4px 16px;position:relative;z-index:5;
  background:
    linear-gradient(180deg,#8a6230,#e8c060 18%,#c4923a 50%,#6a4018 100%);
  border:3px solid #f0d888;
  border-radius:6px;
  box-shadow:0 6px 0 #3a1a08, 0 10px 18px #000, inset 0 1px 0 #fff3c8;
  display:flex;align-items:center;gap:12px;padding:8px 16px 8px 20px;overflow:visible}
.su-beam-copy{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center}
.su-kicker{margin:0;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#3a1208}
.su-h1{position:relative;margin:0;font-family:"Alfa Slab One",serif;font-weight:400;
  font-size:74px;line-height:.9;letter-spacing:-.01em;display:block}
.su-h1 .su-h1-s{position:absolute;left:0;top:0;color:#160300;-webkit-text-stroke:0;text-shadow:
  -3px -3px 0 #160300, 3px -3px 0 #160300, -3px 3px 0 #160300, 3px 3px 0 #160300,
  -4px 0 0 #160300, 4px 0 0 #160300, 0 -4px 0 #160300, 0 4px 0 #160300;z-index:0;pointer-events:none;white-space:nowrap}
.su-h1 .su-h1-f{position:relative;z-index:1;background:linear-gradient(180deg,#fff8d8 0%,#ffd24a 42%,#ff6a00 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#ffd24a;white-space:nowrap}
.su-h1-line2{display:flex;align-items:center;gap:14px;margin-top:2px}
.su-h1-num{font-family:"Alfa Slab One",serif;font-size:72px;line-height:.9}
.su-beam .su-cta{min-height:52px;padding:0 22px;font-size:18px;flex:0 0 auto}

.su-plate{flex:0 0 196px;width:196px;height:168px;margin:-14px 4px -14px 0;
  background:linear-gradient(180deg,#e8c878,#c4923a 40%,#8a6230);
  border:3px solid #fff3c8;border-radius:16px;
  box-shadow:0 8px 16px #000, inset 0 1px 0 #fff8d8;
  display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 8px 8px;z-index:6}
.su-plate img{width:160px;height:160px;object-fit:contain;max-height:132px;width:auto}
.su-plate span{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#3a1208;text-align:center;margin-top:2px}

/* EARTH rods + beads */
.su-earth{flex:1 1 auto;position:relative;margin:4px 28px 16px;min-height:0}
.su-erod{position:absolute;left:0;right:0;height:10px;border-radius:6px;
  background:linear-gradient(180deg,#8a6230,#f0d888 40%,#c4923a 60%,#6a4018);
  box-shadow:0 2px 4px #000}
.su-e1{top:18%}
.su-e2{top:50%}
.su-e3{top:82%}
.su-e4{bottom:2px;opacity:.85} /* empty visual rod like the mockup */

.su-tile{position:absolute;width:138px;height:138px;z-index:3;text-decoration:none;
  filter:drop-shadow(0 8px 10px #000);transform:translate(-50%,-50%)}
.su-tile img{width:100%;height:100%;object-fit:cover;border-radius:50%;border:0}
.su-tile figcaption,.su-cap{position:absolute;left:12%;right:12%;bottom:14%;height:22px;
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:#fff3c8;
  text-align:center;line-height:1;letter-spacing:.01em;text-shadow:0 1px 2px #000;pointer-events:none;white-space:nowrap}
/* The tile art already has a dark plaque; we overlay readable 15-17px names */
.su-badge{position:absolute;top:8px;right:8px;z-index:4;font-size:10px;font-weight:800;letter-spacing:.06em;
  padding:3px 7px;border-radius:999px;color:#fff;border:1px solid #fff3c8}
.su-hot{background:#c01018}
.su-novo{background:#1a8a38}

/* positions matching the mockup: 3 + 3 + 2 on three rods */
.su-t1{left:18%;top:18%}   /* Carpa */
.su-t2{left:50%;top:18%}   /* Sino */
.su-t3{left:82%;top:18%}   /* Chuva */
.su-t4{left:28%;top:50%}   /* Leque */
.su-t5{left:58%;top:50%}   /* Sol */
.su-t6{left:84%;top:50%}   /* Coroa */
.su-t7{left:30%;top:82%}   /* Dado */
.su-t8{left:58%;top:82%}   /* Estrela */

/* ===== BELOW FOLD ===== */
.su-wrap{width:min(1120px,calc(100% - 32px));margin:0 auto}
.su-sec{padding:48px 0 24px;border-top:1px solid var(--su-line)}
.su-sec h2{font-family:"Alfa Slab One",serif;font-size:36px;line-height:1.15;color:var(--su-gold);margin:0 0 12px;
  text-shadow:0 2px 0 #1a0500}
.su-sec h3{font-family:"Alfa Slab One",serif;font-size:22px;color:#ffe08a;margin:20px 0 8px}
.su-sec p,.su-sec li{color:#f3e6c8}
.su-lead{font-size:1.12rem}
.su-note{font-size:.92rem;color:#e8c878}
.su-obs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}
.su-obs article{background:linear-gradient(180deg,#2a1008,#1a0804);border:1px solid var(--su-brass);border-radius:12px;padding:14px 16px}
.su-obs dt,.su-obs .k{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#e8c878;margin:0}
.su-obs dd,.su-obs .v{margin:4px 0 0;font-family:"Alfa Slab One",serif;font-size:20px;color:var(--su-gold);line-height:1.2}
.su-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.su-card{background:linear-gradient(180deg,#2a1008,#1a0804);border:1px solid var(--su-brass);border-radius:14px;padding:16px;overflow:hidden}
.su-card img{border-radius:10px;margin-bottom:10px;width:100%;aspect-ratio:16/9;object-fit:cover}
.su-card h3{margin-top:0}
.su-mini-tiles{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:18px 0}
.su-mini-tiles a{width:140px;text-decoration:none;text-align:center;color:var(--su-cream)}
.su-mini-tiles img{width:140px;height:140px;border-radius:50%;border:3px solid var(--su-brass)}
.su-mini-tiles span{display:block;margin-top:6px;font-weight:800;font-size:14px;color:var(--su-gold)}

.su-faq details{background:#1a0804;border:1px solid var(--su-brass);border-radius:10px;padding:10px 16px;margin:8px 0}
.su-faq summary{cursor:pointer;font-weight:800;color:var(--su-gold)}

.su-cover{width:100%;border-radius:16px;border:2px solid var(--su-brass);margin:8px 0 18px}
.su-crumb{font-size:13px;margin:8px 0 16px;color:#e8c878}
.su-crumb a{color:#ffd24a}

.su-foot{margin-top:40px;padding:28px 0 40px;border-top:2px solid var(--su-brass);background:#100300;color:#e8c878;font-size:14px}
.su-foot a{color:#ffd24a}
.su-foot-row{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between}
.su-disc{margin-top:10px;font-size:13px}
.su-18{display:inline-block;padding:2px 8px;border:1px solid #ffd24a;border-radius:4px;font-weight:800;margin-right:8px}

/* inner pages */
.su-inner .su-hero-page{padding:28px 0 8px}
.su-inner .su-hero-page h1{font-family:"Alfa Slab One",serif;font-size:48px;line-height:1.1;margin:0 0 10px;
  background:linear-gradient(180deg,#fff8d8,#ffd24a 50%,#ff6a00);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:#ffd24a;filter:drop-shadow(0 2px 0 #160300)}
.su-page-art{width:100%;border-radius:16px;border:2px solid var(--su-brass);margin:12px 0 20px}

/* reviews hub */
.su-tools{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:16px 0}
.su-tools input{flex:1 1 260px;min-height:42px;border-radius:8px;border:1px solid var(--su-brass);background:#1a0804;color:#fff3c8;padding:0 12px;font:inherit}
.su-hub{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.su-hub li{background:#1a0804;border:1px solid rgba(196,146,58,.45);border-radius:8px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.su-hub li.is-off{display:none}
.su-hub a{color:#fff3c8;text-decoration:none;font-weight:700}
.su-hub a:hover{color:#ffd24a}
.su-hub .su-revlink{font-size:12px;color:#ffd24a;font-weight:800}
.su-more{display:block;margin:18px auto;min-height:44px;padding:0 22px;border-radius:999px;border:1px solid var(--su-gold);
  background:#2a1008;color:#ffd24a;font-weight:800;cursor:pointer}

.su-rev-actions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0}
.su-cta-alt{background:linear-gradient(180deg,#ffd24a,#c4923a);color:#1a0500;border-color:#fff3c8}
.su-cta-alt:hover{color:#1a0500}

.su-verify{background:#2a1008;border-left:4px solid var(--su-orange);padding:10px 14px;border-radius:0 8px 8px 0;margin:16px 0}

@media (max-width:980px){
  .su-word{font-size:36px}
  .su-nav{display:none}
  .su-h1,.su-h1-num,.su-h1 .su-h1-s,.su-h1 .su-h1-f{font-size:48px;white-space:normal}
  .su-h1 .su-h1-s{white-space:normal}
  .su-obs,.su-grid3,.su-hub{grid-template-columns:1fr 1fr}
  .su-plate{flex-basis:160px;width:160px}
}
@media (max-width:720px){
  .su-top{flex-wrap:wrap;min-height:auto;padding:8px}
  .su-word{font-size:32px}
  .su-fold{height:auto;max-height:none;padding:8px}
  .su-table{height:auto}
  .su-frame{position:relative;inset:auto;display:block;padding-bottom:16px}
  .su-heaven{height:auto;flex:none;margin:12px 8px;display:flex;gap:8px;justify-content:center}
  .su-heaven .su-rod{display:none}
  .su-promo{position:relative;left:auto;top:auto;transform:none;width:30%;height:auto}
  .su-beam{flex-direction:column;height:auto;flex:none;padding:14px;margin:8px}
  .su-h1,.su-h1-num{font-size:40px}
  .su-h1 .su-h1-f,.su-h1 .su-h1-s{white-space:normal}
  .su-plate{width:min(200px,80%);height:auto;margin:8px auto;flex-basis:auto}
  .su-plate img{max-height:160px;height:160px;width:160px}
  .su-earth{position:relative;height:auto;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:12px 8px 20px}
  .su-erod{display:none}
  .su-tile{position:relative;left:auto;top:auto;transform:none;width:30%;height:auto;aspect-ratio:1}
  .su-obs,.su-grid3,.su-hub{grid-template-columns:1fr}
  .su-coins{display:none}
}

.su-beam-copy{position:relative}
.su-h1{display:flex;flex-direction:column;align-items:flex-start}
.su-h1-cta-row{position:absolute;left:220px;bottom:10px;z-index:4}
figcaption{font-size:13px;color:#e8c878;margin:6px 0 0}
.su-hero-page figcaption{margin-bottom:8px}

/* ===== FIX PASS: scale, no overlap, 160px logo, mobile H1 ===== */
.su-top{min-height:64px}
.su-word{font-size:48px}
.su-bead{width:48px;height:48px;flex-basis:48px}
.su-tick{height:22px}
.su-fold{height:714px;max-height:714px;padding:6px 12px 4px}
.su-coins{z-index:1;width:200px;height:110px;bottom:0}
.su-frame{z-index:2;inset:6px 16px 8px;overflow:visible}
.su-heaven{flex:0 0 122px;margin:8px 26px 0}
.su-promo{width:186px;height:116px}
.su-beam{flex:0 0 138px;margin:2px 14px;overflow:visible;z-index:5}
.su-h1{font-size:70px}
.su-h1-num{font-size:66px}
.su-h1-cta-row{left:200px;bottom:8px}
.su-plate{flex:0 0 208px;width:208px;height:196px;margin:-30px 2px -28px 0;padding:8px 8px 6px}
.su-plate img{width:160px;height:160px;max-height:160px;max-width:160px}
.su-earth{flex:1 1 auto;display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:1fr 1fr 1fr;align-items:center;justify-items:center;margin:2px 22px 14px;min-height:0;position:relative;z-index:3}
.su-erod{z-index:0}
.su-tile{position:relative;left:auto;top:auto;transform:none;width:124px;height:124px;z-index:3}
.su-t1{grid-column:2/5;grid-row:1;left:auto;top:auto}
.su-t2{grid-column:5/9;grid-row:1;left:auto;top:auto}
.su-t3{grid-column:9/13;grid-row:1;left:auto;top:auto}
.su-t4{grid-column:3/6;grid-row:2;left:auto;top:auto}
.su-t5{grid-column:6/10;grid-row:2;left:auto;top:auto}
.su-t6{grid-column:10/13;grid-row:2;left:auto;top:auto}
.su-t7{grid-column:3/7;grid-row:3;left:auto;top:auto}
.su-t8{grid-column:7/11;grid-row:3;left:auto;top:auto}
.su-cap{left:12px;right:12px;bottom:16px;height:24px;max-height:24px;font-size:10px;line-height:1.1;white-space:normal;overflow:hidden;display:flex;align-items:center;justify-content:center}
.su-e1{top:16%}
.su-e2{top:50%}
.su-e3{top:84%}

@media (max-width:980px){
  .su-nav{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px}
  .su-nav a{height:34px;font-size:13px;padding:0 10px}
  .su-word{font-size:40px}
  .su-h1,.su-h1-num{font-size:48px}
  .su-h1 .su-h1-s,.su-h1 .su-h1-f{white-space:normal}
  .su-obs,.su-grid3,.su-hub{grid-template-columns:1fr 1fr}
  .su-h1-cta-row{position:static;margin:8px 0 0}
}

@media (max-width:720px){
  .su-top{flex-wrap:wrap;min-height:auto;padding:8px}
  .su-brand{flex:1 1 auto}
  .su-word{font-size:32px}
  .su-nav{display:flex;order:3;width:100%;justify-content:flex-start}
  .su-fold{height:auto;max-height:none;padding:8px}
  .su-table{height:auto}
  .su-frame{position:relative;inset:auto;display:flex;flex-direction:column;padding-bottom:12px}
  .su-heaven{height:auto;flex:none;margin:10px 8px;display:flex;gap:6px;justify-content:center}
  .su-heaven .su-rod{display:none}
  .su-promo{position:relative;left:auto;top:auto;transform:none;width:32%;height:auto;aspect-ratio:1.5}
  .su-beam{flex-direction:column;height:auto;flex:none;padding:14px 12px;margin:8px;align-items:stretch}
  .su-beam-copy{position:static}
  .su-h1,.su-h1-num,.su-h1 .su-h1-f{font-size:34px;line-height:1.05;white-space:normal;max-width:100%}
  .su-h1 .su-h1-s{display:none}
  .su-h1 .su-h1-f{white-space:normal;-webkit-text-fill-color:#ffd24a;background:linear-gradient(180deg,#fff8d8,#ffd24a 45%,#ff6a00);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 0 #160300)}
  .su-h1-cta-row{position:static;left:auto;bottom:auto;margin:10px 0 0}
  .su-plate{width:min(220px,86%);height:auto;margin:12px auto 4px;flex-basis:auto}
  .su-plate img{width:160px;height:160px;max-height:160px}
  .su-earth{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;height:auto;margin:12px 8px 16px;gap:8px 6px}
  .su-erod{display:none}
  .su-tile{position:relative;left:auto;top:auto;transform:none;width:min(148px,100%);height:auto;aspect-ratio:1;grid-column:auto;grid-row:auto}
  .su-t1,.su-t2,.su-t3,.su-t4,.su-t5,.su-t6,.su-t7,.su-t8{grid-column:auto;grid-row:auto;left:auto;top:auto}
  .su-obs,.su-grid3,.su-hub{grid-template-columns:1fr}
  .su-coins{display:none}
  .su-cap{font-size:11px;white-space:normal}
  .su-inner .su-hero-page h1{font-size:32px}
}