/* Symtri sample sites (/samples/*). Four fictional businesses, one layout each, original
   takes on four Framer templates used as visual references only (see tools/build-samples.py).
   Built by tools/build-samples.py; edit the config there, not the HTML. */
*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--body),system-ui,sans-serif;color:var(--ink);background:var(--bg);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img,svg{display:block;max-width:100%}
h1,h2,h3,.logo{font-family:var(--disp),system-ui,sans-serif;text-wrap:balance}
.w{width:100%;max-width:1240px;margin:0 auto;padding:0 clamp(18px,4vw,48px)}
.notice{background:#0B0B0C;color:#fff;font:500 13px/1.4 'Inter',system-ui,sans-serif;text-align:center;padding:9px 14px}
.notice a{color:#fff;font-weight:700}
.btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;white-space:nowrap;line-height:1}
.btn svg{width:17px;height:17px;flex-shrink:0}
.link{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:600}
.link svg{width:17px;height:17px}
.sh{margin-bottom:clamp(28px,4vw,48px)}
.sh h2{font-size:clamp(32px,4.2vw,54px);line-height:1.04;letter-spacing:-.02em;max-width:18ch}
.sh p{margin-top:12px;max-width:44ch;opacity:.72}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.chips span{font-size:15.5px;font-weight:600;padding:10px 16px;border:1px solid var(--line);border-radius:var(--r-chip)}
.hours{border:1px solid var(--line);border-radius:var(--r-card);padding:26px;background:var(--card)}
.hours h3{font-size:22px}
.hours dl{display:grid;grid-template-columns:auto 1fr;gap:10px 22px;margin-top:14px}
.hours dt{font-weight:700}
.hours dd{opacity:.78}
.area{display:grid;grid-template-columns:1fr;gap:32px;align-items:start}
@media (min-width:900px){.area{grid-template-columns:1.2fr .8fr}}
.ft{font-size:15px}
.ft .w{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 32px}
.ft a{opacity:.85}
.ft .cols{display:grid;grid-template-columns:1fr;gap:28px;padding-top:48px;padding-bottom:36px}
@media (min-width:820px){.ft .cols{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.ft .cols p{margin-top:14px;opacity:.75;max-width:30ch}
.ft h4{font-size:13px;letter-spacing:.12em;text-transform:uppercase;opacity:.6;margin-bottom:12px}
.ft ul{list-style:none}
.ft li{padding:4px 0;opacity:.85}
.ft .hl li{display:flex;justify-content:space-between;gap:12px;max-width:260px}
.ft .legal{border-top:1px solid var(--line);padding-top:18px;padding-bottom:110px;opacity:.75}
@media (min-width:821px){.ft .legal{padding-bottom:28px}}
.mbar{position:fixed;left:12px;right:12px;bottom:12px;z-index:30;display:none}
.mbar a{display:flex;justify-content:center;align-items:center;gap:10px;background:var(--cta);color:var(--on-cta);text-decoration:none;font-weight:700;font-size:17px;padding:16px;border-radius:var(--r-btn);box-shadow:0 14px 30px -12px rgba(0,0,0,.5)}
.mbar svg{width:18px;height:18px}
@media (max-width:820px){.mbar{display:block}body[data-style] .hd .nav,body[data-style] .hd .btn,body[data-style] .hd .phone-txt{display:none}body[data-style] .hd .w{gap:12px}.logo{min-width:0}}
.steps{list-style:none;display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:860px){.steps{grid-template-columns:repeat(3,1fr)}}
.steps h3{font-size:21px;margin-top:12px}
.steps p{margin-top:8px;opacity:.75}
@media (prefers-reduced-motion:no-preference){.hero h1,.hero .sub,.hero .ctas{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}.hero .sub{animation-delay:.08s}.hero .ctas{animation-delay:.16s}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ============================================================ panel (Cold Front)
   Two big dark rounded panels, one amber word, geometric headline. */
[data-style=panel]{--disp:'Outfit';--body:'Inter';--bg:#F4F3EE;--ink:#1B1E12;--muted:#5E5F57;--line:#E0DBD0;--card:#FFFFFF;--dark:#1B1E12;--dark-fg:#F4F3EE;--amber:#EA9B00;--cta:#EA9B00;--on-cta:#1B1E12;--r-btn:999px;--r-chip:999px;--r-card:18px;--r-panel:28px}
[data-style=panel] .hd{position:sticky;top:0;z-index:20;background:rgba(244,243,238,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
[data-style=panel] .hd .w{display:flex;align-items:center;gap:22px;height:72px}
[data-style=panel] .logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;font-size:19px;letter-spacing:-.01em}
[data-style=panel] .logo i{width:30px;height:30px;border-radius:9px;background:var(--amber);display:grid;place-items:center;font-style:normal;font-size:13px;font-weight:800;color:var(--dark)}
[data-style=panel] .nav{display:flex;gap:24px;margin-left:12px;font-size:15px;font-weight:500}
[data-style=panel] .nav a{text-decoration:none;opacity:.75}
[data-style=panel] .phone-txt{margin-left:auto;text-decoration:none;font-weight:600;font-size:15px}
[data-style=panel] .btn{padding:13px 20px;border-radius:999px;font-size:15px}
[data-style=panel] .btn.dark{background:var(--dark);color:var(--dark-fg)}
[data-style=panel] .btn.amber{background:var(--amber);color:var(--dark);font-size:16px;padding:16px 24px}
[data-style=panel] .hero .w{padding-top:22px}
[data-style=panel] .panels{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width:960px){[data-style=panel] .panels{grid-template-columns:1.1fr .9fr}}
[data-style=panel] .panel{border-radius:var(--r-panel);overflow:hidden}
[data-style=panel] .panel.text{background:var(--dark);color:var(--dark-fg);padding:clamp(32px,5vw,64px);display:flex;flex-direction:column;justify-content:center;min-height:520px}
[data-style=panel] .pill{display:inline-flex;align-items:center;gap:9px;align-self:flex-start;border:1px solid rgba(244,243,238,.25);border-radius:999px;padding:8px 14px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
[data-style=panel] .pill i{width:7px;height:7px;border-radius:50%;background:#7CE38B}
[data-style=panel] h1{font-size:clamp(42px,5.4vw,76px);line-height:1.02;letter-spacing:-.03em;font-weight:700;margin-top:28px}
[data-style=panel] h1 em{font-style:normal;color:var(--amber)}
[data-style=panel] .sub{margin-top:22px;font-size:18px;opacity:.8;max-width:40ch}
[data-style=panel] .ctas{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:34px}
[data-style=panel] .link{font-size:15px}
[data-style=panel] .panel.photo{position:relative;min-height:380px;background:var(--dark)}
[data-style=panel] .panel.photo img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
[data-style=panel] .tag{position:absolute;right:18px;bottom:18px;left:18px;max-width:300px;margin-left:auto;background:#F3E8D6;color:var(--dark);border-radius:16px;padding:16px 18px;display:grid;gap:4px}
[data-style=panel] .tag small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.7}
[data-style=panel] .tag b{font-size:19px;font-family:var(--disp)}
[data-style=panel] .tag span{font-size:14px;opacity:.8}
[data-style=panel] .strip .w{display:flex;flex-wrap:wrap;align-items:center;gap:18px 40px;padding-top:34px;padding-bottom:10px}
[data-style=panel] .strip .lbl{font-size:12px;letter-spacing:.16em;text-transform:uppercase;opacity:.55;padding-right:28px;border-right:1px solid var(--line)}
[data-style=panel] .strip ul{list-style:none;display:flex;flex-wrap:wrap;gap:12px 28px;font-weight:600;font-size:15px}
[data-style=panel] .strip li{display:flex;align-items:center;gap:8px}
[data-style=panel] .strip li svg{width:16px;height:16px;color:var(--amber)}
[data-style=panel] .sec{padding:clamp(56px,7vw,96px) 0}
[data-style=panel] .sec+.sec{padding-top:0}
[data-style=panel] .grid4{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:700px){[data-style=panel] .grid4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){[data-style=panel] .grid4{grid-template-columns:repeat(4,1fr)}}
[data-style=panel] .card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:26px}
[data-style=panel] .card b{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--dark);color:var(--amber);font-size:13px;font-family:var(--disp)}
[data-style=panel] .card h3{font-size:22px;margin-top:22px}
[data-style=panel] .card p{margin-top:8px;opacity:.72}
[data-style=panel] .steps-panel{background:var(--dark);color:var(--dark-fg);padding:clamp(32px,5vw,64px)}
[data-style=panel] .steps-panel .sh p,[data-style=panel] .steps p{opacity:.7}
[data-style=panel] .steps li{border:1px solid rgba(244,243,238,.14);border-radius:var(--r-card);padding:26px}
[data-style=panel] .steps .n{font-family:var(--disp);font-weight:700;font-size:15px;color:var(--amber)}
[data-style=panel] .chips span{background:var(--card)}
[data-style=panel] .band{background:var(--dark);color:var(--dark-fg);text-align:center;padding:clamp(56px,8vw,96px) clamp(24px,5vw,64px)}
[data-style=panel] .band h2{font-size:clamp(36px,5vw,64px);line-height:1;letter-spacing:-.03em}
[data-style=panel] .band .ph{display:inline-block;margin-top:24px;font-family:var(--disp);font-weight:700;font-size:clamp(30px,4vw,52px);color:var(--amber);text-decoration:none}
[data-style=panel] .band p{margin-top:12px;opacity:.7}
[data-style=panel] .ft .w{padding:34px 0 110px;border-top:1px solid var(--line);opacity:.8}
@media (min-width:821px){[data-style=panel] .ft .w{padding-bottom:34px}}

/* ============================================================ poster (Palm Alley)
   Giant uppercase headline, black rounded cards, an orange dot on every button. */
[data-style=poster]{--disp:'Bebas Neue';--body:'Inter';--bg:#F7F7F4;--ink:#141414;--line:#DFDFDC;--card:#FFFFFF;--black:#252525;--orange:#F25912;--cta:#252525;--on-cta:#FFFFFF;--r-btn:999px;--r-chip:999px;--r-card:22px}
[data-style=poster] h1,[data-style=poster] h2,[data-style=poster] h3{font-weight:400;letter-spacing:.01em}
[data-style=poster] .hd{position:sticky;top:10px;z-index:20;padding:0 12px}
[data-style=poster] .bar{display:flex;align-items:center;gap:24px;height:68px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:18px;max-width:1140px}
[data-style=poster] .logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:24px;line-height:1}
[data-style=poster] .logo i{width:30px;height:30px;border-radius:50%;background:var(--orange);display:grid;place-items:center;font-family:'Inter';font-style:normal;font-size:12px;font-weight:800;color:#fff}
[data-style=poster] .nav{display:flex;gap:24px;margin-left:auto;margin-right:auto;font-size:15px;font-weight:500}
[data-style=poster] .nav a{text-decoration:none;opacity:.75}
[data-style=poster] .phone-txt{margin-left:auto;text-decoration:none;font-weight:600;font-size:15px}
[data-style=poster] .hero .w{text-align:center;padding-top:clamp(40px,6vw,80px)}
[data-style=poster] .pill{display:inline-flex;align-items:center;background:var(--black);color:#fff;border-radius:999px;padding:6px 6px 6px 16px;font-size:13px;font-weight:600}
[data-style=poster] .pill span{background:#fff;color:var(--black);border-radius:999px;padding:6px 12px;margin-left:10px}
[data-style=poster] h1{font-size:clamp(72px,12.5vw,176px);line-height:.88;text-transform:uppercase;margin-top:28px}
[data-style=poster] .sub{margin:22px auto 0;font-size:clamp(17px,1.5vw,20px);max-width:48ch;opacity:.8}
[data-style=poster] .ctas{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px;margin-top:30px}
[data-style=poster] .btn{background:var(--black);color:#fff;border-radius:999px;padding:6px 6px 6px 24px;font-size:15px;gap:14px}
[data-style=poster] .btn i{width:40px;height:40px;border-radius:50%;background:var(--orange);display:grid;place-items:center;color:#fff}
[data-style=poster] .btn.small{padding:5px 5px 5px 18px;font-size:14px}
[data-style=poster] .btn.small i{width:32px;height:32px}
[data-style=poster] .link{font-size:15px;opacity:.8;text-decoration:underline;text-underline-offset:4px}
[data-style=poster] .frame{margin-top:clamp(36px,5vw,64px);border-radius:var(--r-card);overflow:hidden;box-shadow:0 30px 70px -40px rgba(0,0,0,.5)}
[data-style=poster] .frame img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
@media (max-width:700px){[data-style=poster] .frame img{aspect-ratio:4/3}}
[data-style=poster] .sec{padding:clamp(60px,8vw,110px) 0 0}
[data-style=poster] .sh h2{font-size:clamp(44px,6vw,88px);line-height:.92;text-transform:uppercase;max-width:none}
[data-style=poster] .reasons{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:860px){[data-style=poster] .reasons{grid-template-columns:repeat(3,1fr)}}
[data-style=poster] .reason{border-top:2px solid var(--black);padding:22px 0 8px}
[data-style=poster] .reason .k{font-family:var(--disp);font-size:20px;color:var(--orange)}
[data-style=poster] .reason h3{font-size:34px;margin-top:10px;line-height:1}
[data-style=poster] .reason p{margin-top:8px;opacity:.75}
[data-style=poster] .steps li{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:26px}
[data-style=poster] .steps .n{font-family:var(--disp);font-size:44px;line-height:1;color:var(--orange)}
[data-style=poster] .steps h3{font-size:30px;line-height:1;margin-top:10px}
[data-style=poster] .cards{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:700px){[data-style=poster] .cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){[data-style=poster] .cards{grid-template-columns:repeat(4,1fr)}}
[data-style=poster] .card{background:var(--black);color:#fff;border-radius:var(--r-card);padding:28px 24px;display:flex;flex-direction:column;min-height:280px}
[data-style=poster] .card h3{font-size:36px;line-height:1}
[data-style=poster] .card p{margin-top:10px;opacity:.75;flex:1}
[data-style=poster] .card .btn{background:#fff;color:var(--black);align-self:flex-start;margin-top:22px}
[data-style=poster] .band{margin-top:clamp(60px,8vw,110px);background:var(--black);color:#fff;text-align:center;padding:clamp(80px,10vw,140px) 0}
[data-style=poster] .band h2{font-size:clamp(64px,10vw,150px);line-height:.88;text-transform:uppercase}
[data-style=poster] .band .ph{display:inline-block;margin-top:26px;font-family:var(--disp);font-size:clamp(40px,5vw,72px);text-decoration:none;color:var(--orange)}
[data-style=poster] .band p{margin-top:10px;opacity:.7}
[data-style=poster] .chips span{background:var(--card)}
[data-style=poster] .area{padding-bottom:clamp(60px,8vw,110px)}
[data-style=poster] .ft{background:var(--black);color:#C9C9C4}
[data-style=poster] .ft .w{padding:34px 0 110px}
@media (min-width:821px){[data-style=poster] .ft .w{padding-bottom:34px}}
[data-style=poster] .mbar a{padding:14px 16px}

/* ============================================================ warm (Arroyo Azul)
   Cream and navy, a terracotta button with a chevron tile, a four-feature card strip. */
[data-style=warm]{--disp:'Poppins';--body:'Inter';--bg:#F5F2EC;--ink:#131D2E;--muted:#5B6474;--line:#E6DFD3;--card:#FDFCFB;--terra:#CE6837;--navy:#131D2E;--cta:#CE6837;--on-cta:#FFFFFF;--r-btn:14px;--r-chip:10px;--r-card:18px}
[data-style=warm] .hd{position:sticky;top:0;z-index:20;background:rgba(253,252,251,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
[data-style=warm] .hd .w{display:flex;align-items:center;gap:24px;height:78px}
[data-style=warm] .logo{display:flex;align-items:center;gap:12px;text-decoration:none;line-height:1}
[data-style=warm] .logo i{width:40px;height:40px;border-radius:10px;border:1.5px solid var(--navy);display:grid;place-items:center;font-style:normal;font-size:14px;font-weight:700;color:var(--navy)}
[data-style=warm] .logo b{display:block;font-size:22px;font-weight:700;letter-spacing:-.02em}
[data-style=warm] .logo small{display:block;font-size:11px;letter-spacing:.28em;text-transform:uppercase;margin-top:3px;opacity:.75}
[data-style=warm] .nav{display:flex;gap:28px;margin-left:auto;margin-right:auto;font-size:15px;font-weight:500}
[data-style=warm] .nav a{text-decoration:none;opacity:.8}
[data-style=warm] .btn.tile{background:var(--terra);color:#fff;border-radius:var(--r-btn);padding:6px 6px 6px 20px;font-size:16px;gap:14px;box-shadow:0 10px 24px -14px rgba(206,104,55,.9)}
[data-style=warm] .btn.tile i{width:38px;height:38px;border-radius:10px;background:#fff;color:var(--terra);display:grid;place-items:center}
[data-style=warm] .btn.tile i svg{width:18px;height:18px}
[data-style=warm] .hero .w{padding-top:clamp(28px,4vw,56px)}
[data-style=warm] .pill{display:inline-flex;align-items:center;gap:9px;background:#fff;border-radius:999px;padding:8px 14px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--terra);box-shadow:0 6px 18px -10px rgba(0,0,0,.25)}
[data-style=warm] .pill i{width:8px;height:8px;border-radius:50%;background:var(--terra)}
[data-style=warm] h1{font-size:clamp(44px,6.4vw,92px);line-height:1;letter-spacing:-.03em;font-weight:700;margin-top:26px;max-width:14ch}
[data-style=warm] h1 em{font-family:'Festive',cursive;font-style:normal;font-weight:400;color:var(--terra);font-size:1.18em;letter-spacing:0}
[data-style=warm] .sub{margin-top:20px;font-size:18px;max-width:44ch;color:var(--muted)}
[data-style=warm] .ctas{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:30px}
[data-style=warm] .play{display:inline-flex;align-items:center;gap:12px;text-decoration:none}
[data-style=warm] .play i{width:44px;height:44px;border-radius:50%;background:#F8E3D8;color:var(--terra);display:grid;place-items:center}
[data-style=warm] .play i svg{width:20px;height:20px}
[data-style=warm] .play b{display:block;font-size:15px}
[data-style=warm] .play small{display:block;font-size:13px;opacity:.65}
[data-style=warm] .frame{margin-top:clamp(32px,4vw,52px);border-radius:var(--r-card);overflow:hidden;box-shadow:0 30px 70px -40px rgba(19,29,46,.6)}
[data-style=warm] .frame img{width:100%;height:auto;aspect-ratio:16/8;object-fit:cover}
@media (max-width:700px){[data-style=warm] .frame img{aspect-ratio:4/3}}
[data-style=warm] .features{margin-top:-40px;position:relative;z-index:2;background:var(--card);border-radius:var(--r-card);box-shadow:0 20px 50px -30px rgba(19,29,46,.4);padding:8px;display:grid;grid-template-columns:1fr;gap:4px;margin-left:clamp(0px,2vw,24px);margin-right:clamp(0px,2vw,24px)}
@media (min-width:700px){[data-style=warm] .features{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){[data-style=warm] .features{grid-template-columns:repeat(4,1fr)}}
[data-style=warm] .features>div{padding:22px}
@media (min-width:1080px){[data-style=warm] .features>div+div{border-left:1px solid var(--line)}}
[data-style=warm] .features i{width:44px;height:44px;border-radius:50%;background:#F8E3D8;color:var(--terra);display:grid;place-items:center}
[data-style=warm] .features i svg{width:18px;height:18px}
[data-style=warm] .features h3{font-size:19px;font-weight:600;margin-top:16px}
[data-style=warm] .features p{margin-top:6px;font-size:15px;color:var(--muted)}
[data-style=warm] .sec{padding:clamp(60px,8vw,110px) 0}
[data-style=warm] .sec.alt{background:#fff}
[data-style=warm] .sh h2{font-weight:600}
[data-style=warm] .sh p{color:var(--muted);opacity:1}
[data-style=warm] .grid2{display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:760px){[data-style=warm] .grid2{grid-template-columns:repeat(2,1fr)}}
[data-style=warm] .card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:28px;display:grid;grid-template-columns:auto 1fr;gap:6px 18px;align-items:start}
[data-style=warm] .card .k{grid-row:span 2;width:44px;height:44px;border-radius:50%;background:#F8E3D8;color:var(--terra);display:grid;place-items:center;font-family:var(--disp);font-weight:600;font-size:14px}
[data-style=warm] .card h3{font-size:22px;font-weight:600}
[data-style=warm] .card p{color:var(--muted)}
[data-style=warm] .steps li{background:var(--bg);border-radius:var(--r-card);padding:26px}
[data-style=warm] .steps .n{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--navy);color:#fff;font-family:var(--disp);font-weight:600}
[data-style=warm] .steps h3{font-weight:600}
[data-style=warm] .chips span{background:var(--card)}
[data-style=warm] .band{background:var(--navy);color:#F5F2EC;text-align:center;padding:clamp(70px,9vw,120px) 0}
[data-style=warm] .band h2{font-size:clamp(36px,5vw,64px);font-weight:600;letter-spacing:-.02em;line-height:1.04}
[data-style=warm] .band .ph{display:inline-block;margin-top:24px;font-family:var(--disp);font-weight:700;font-size:clamp(30px,4vw,50px);color:#F3B38F;text-decoration:none}
[data-style=warm] .band p{margin-top:10px;opacity:.75}
[data-style=warm] .ft{background:var(--bg)}
[data-style=warm] .ft .logo b{font-size:20px}

/* ============================================================ estate (Brush Line)
   Cream and charcoal, an olive button, a letterspaced wordmark, uppercase kickers. */
[data-style=estate]{--disp:'Onest';--body:'Inter';--bg:#F6F3ED;--ink:#1E2428;--muted:#5F6467;--line:#D9D4C8;--card:#FDFBF7;--olive:#6F7450;--olive2:#8A8F63;--char:#1E2428;--cta:#6F7450;--on-cta:#FFFFFF;--r-btn:6px;--r-chip:6px;--r-card:10px}
[data-style=estate] .hd{position:sticky;top:0;z-index:20;background:rgba(246,243,237,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
[data-style=estate] .hd .w{display:flex;align-items:center;gap:24px;height:74px}
[data-style=estate] .logo{text-decoration:none;font-weight:600;font-size:19px;letter-spacing:.3em;text-transform:uppercase}
[data-style=estate] .nav{display:flex;gap:26px;margin-left:auto;margin-right:auto;font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
[data-style=estate] .nav a{text-decoration:none;opacity:.8}
[data-style=estate] .btn{padding:14px 22px;border-radius:var(--r-btn);font-size:13px;letter-spacing:.1em;text-transform:uppercase}
[data-style=estate] .btn.olive{background:var(--olive);color:#fff}
[data-style=estate] .btn.ghost{border:1.5px solid var(--char);color:var(--char)}
[data-style=estate] .btn.light{background:#fff;color:var(--char);font-size:15px;letter-spacing:0;text-transform:none}
[data-style=estate] .kick{font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--olive2)}
[data-style=estate] .hero .w{text-align:center;padding-top:clamp(48px,7vw,96px)}
[data-style=estate] h1{font-size:clamp(44px,6.5vw,94px);line-height:1;letter-spacing:-.035em;font-weight:600;margin:18px auto 0;max-width:14ch}
[data-style=estate] .sub{margin:20px auto 0;font-size:18px;max-width:44ch;color:var(--muted)}
[data-style=estate] .ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:30px}
[data-style=estate] .frame{margin-top:clamp(36px,5vw,64px);border:1px solid var(--line);border-radius:var(--r-card);padding:10px;background:var(--card)}
[data-style=estate] .frame img{width:100%;height:auto;aspect-ratio:16/8;object-fit:cover;border-radius:6px}
@media (max-width:700px){[data-style=estate] .frame img{aspect-ratio:4/3}}
[data-style=estate] .aside{display:grid;gap:6px;max-width:340px;margin:22px 0 0 auto;text-align:left;font-size:14px;padding-left:16px;border-left:2px solid var(--olive2)}
[data-style=estate] .aside b{font-size:12px;letter-spacing:.14em;text-transform:uppercase}
[data-style=estate] .aside span{color:var(--muted)}
[data-style=estate] .sec{padding:clamp(60px,8vw,110px) 0}
[data-style=estate] .sec.alt{background:#EFEBE3}
[data-style=estate] .sh .kick{margin-bottom:12px}
[data-style=estate] .sh h2{font-weight:600;letter-spacing:-.03em}
[data-style=estate] .sh p{color:var(--muted);opacity:1}
[data-style=estate] .grid2{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:760px){[data-style=estate] .grid2{grid-template-columns:repeat(2,1fr)}}
[data-style=estate] .card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:30px;display:flex;flex-direction:column}
[data-style=estate] .card h3{font-size:24px;font-weight:600}
[data-style=estate] .card p{margin-top:8px;color:var(--muted);flex:1}
[data-style=estate] .card a{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--olive)}
[data-style=estate] .card a svg{width:16px;height:16px}
[data-style=estate] .steps li{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:28px}
[data-style=estate] .steps .n{font-family:var(--disp);font-weight:600;font-size:14px;letter-spacing:.14em;color:var(--olive2)}
[data-style=estate] .steps h3{font-weight:600}
[data-style=estate] .area h2{font-size:clamp(32px,4.2vw,54px);font-weight:600;letter-spacing:-.03em;margin-top:12px}
[data-style=estate] .chips span{background:var(--card)}
[data-style=estate] .band{background:linear-gradient(100deg,#1E2428 0%,#2B3236 55%,#6F7450 140%);color:#F6F3ED;padding:clamp(70px,9vw,120px) 0}
[data-style=estate] .band .kick{color:#C8CBA6}
[data-style=estate] .band h2{font-size:clamp(36px,5vw,64px);font-weight:600;letter-spacing:-.03em;line-height:1.02;margin-top:12px;max-width:16ch}
[data-style=estate] .band p{margin-top:14px;max-width:46ch;opacity:.8}
[data-style=estate] .band .ctas{justify-content:flex-start;margin-top:26px}
[data-style=estate] .ft{background:var(--char);color:#C9CDCF}
[data-style=estate] .ft .logo{color:#fff}
[data-style=estate] .ft .legal{border-top-color:rgba(255,255,255,.12)}