:root {
  --ink:#111827;
  --muted:#64748b;
  --line:#dbe5f4;
  --soft:#f8f6f0;
  --brand:#10233f;
  --brand-2:#b8954b;
  --accent:#d8be73;
  --paper:#fff;
  --glass:rgba(255,255,255,.86);
  --shadow:0 28px 76px rgba(16,35,63,.12);
  --shadow-sm:0 14px 34px rgba(16,35,63,.08);
  --radius:18px;
}
* { box-sizing: border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:linear-gradient(180deg,#fbfaf6 0%,#f4f1ea 42%,#fff 78%); line-height:1.8; }
a { color:var(--brand); }
.site-header { position:sticky; top:0; z-index:10; background:rgba(255,255,255,.90); color:var(--ink); padding:16px 20px; border-bottom:1px solid rgba(216,190,115,.32); backdrop-filter:blur(18px); }
.site-header .wrap { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.wrap { max-width:1160px; margin:0 auto; }
.brand { font-size:20px; font-weight:950; margin:0; letter-spacing:0; }
.nav { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:16px; }
.nav a { color:#334155; text-decoration:none; font-weight:750; font-size:14px; }
.nav a:hover { color:var(--brand); }
.header-cta { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:8px 15px; border-radius:999px; background:linear-gradient(135deg,var(--brand),#233e65); color:#fff !important; box-shadow:0 14px 32px rgba(16,35,63,.18); }
.hero { position:relative; overflow:hidden; color:var(--ink); padding:104px 20px 92px; background:radial-gradient(circle at 12% 8%, rgba(216,190,115,.20), transparent 30%), radial-gradient(circle at 90% 4%, rgba(16,35,63,.10), transparent 34%), linear-gradient(135deg,#ffffff 0%,#fbfaf6 48%,#f1eee7 100%); }
.hero:before { content:""; position:absolute; inset:auto -8% -35% 42%; height:440px; border-radius:999px; background:linear-gradient(90deg,rgba(16,35,63,.10),rgba(184,149,75,.16)); filter:blur(22px); transform:rotate(-10deg); }
.hero .wrap { position:relative; }
.hero-inner { display:grid; grid-template-columns:minmax(0,1.04fr) minmax(340px,.96fr); gap:44px; align-items:center; }
.hero-copy { min-width:0; }
.hero h1 { margin:0; max-width:760px; font-size:clamp(40px,6vw,76px); line-height:1.04; font-weight:950; letter-spacing:0; }
.hero p { max-width:720px; font-size:19px; color:#334155; }
.hero-meta { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; padding:0; list-style:none; }
.hero-meta li { border:1px solid rgba(219,229,244,.9); border-radius:999px; padding:7px 12px; background:rgba(255,255,255,.72); color:#475569; font-size:13px; font-weight:750; }
.hero-visual { min-width:0; }
.header-image { margin:0; overflow:hidden; border-radius:26px; background:#ede8dc; border:1px solid rgba(255,255,255,.9); box-shadow:0 36px 90px rgba(16,35,63,.20); }
.header-image img { display:block; width:100%; height:clamp(320px,42vw,560px); object-fit:cover; }
.hero-placeholder { min-height:380px; border-radius:30px; border:1px solid rgba(219,229,244,.9); background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(139,92,246,.16)), radial-gradient(circle at 72% 24%, rgba(6,182,212,.18), transparent 34%); box-shadow:var(--shadow); }
.logo-block img { max-width:180px; max-height:120px; object-fit:contain; display:block; margin:0 0 18px; }
.gallery-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.gallery-item { margin:0; border-radius:22px; overflow:hidden; border:1px solid var(--line); background:#fff; box-shadow:var(--shadow-sm); }
.gallery-item img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
main { background:transparent; }
section { padding:68px 20px; }
section:nth-of-type(even) { background:rgba(255,255,255,.54); }
h1 { line-height:1.25; }
h2 { margin:0 0 24px; font-size:clamp(28px,3vw,42px); line-height:1.16; font-weight:950; }
h3 { font-size:21px; margin:0 0 10px; }
.grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.card { border:1px solid rgba(219,229,244,.92); border-radius:var(--radius); padding:26px; background:var(--glass); box-shadow:var(--shadow-sm); backdrop-filter:blur(16px); }
.info-list { display:grid; grid-template-columns:170px 1fr; gap:10px 16px; }
.info-list dt { font-weight:700; color:#334155; }
.info-list dd { margin:0; }
.feature-list,.flow-list { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:0; padding:0; list-style:none; }
.feature-list li,.flow-list li { border:1px solid rgba(219,229,244,.92); border-radius:var(--radius); padding:24px; background:var(--glass); box-shadow:var(--shadow-sm); }
.eyebrow { display:inline-flex; margin-bottom:14px; padding:6px 11px; border-radius:999px; background:rgba(37,99,235,.1); color:#1d4ed8; font-weight:800; font-size:13px; }
.check-list { display:grid; grid-template-columns:repeat(2,1fr); gap:10px 16px; margin:0; padding:0; list-style:none; }
.check-list li { border:1px solid var(--line); border-radius:18px; padding:16px 18px; background:rgba(255,255,255,.82); box-shadow:0 10px 24px rgba(15,23,42,.05); }
.used-list { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:0 0 22px; padding:0; list-style:none; }
.used-list li { border:1px solid var(--line); border-radius:16px; padding:12px 14px; background:#fff; }
.cta-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.btn { display:inline-flex; min-height:52px; align-items:center; justify-content:center; padding:12px 22px; border-radius:999px; border:1px solid var(--brand); text-decoration:none; font-weight:850; box-shadow:0 14px 32px rgba(16,35,63,.12); }
.btn.primary { background:linear-gradient(135deg,var(--brand),var(--brand-2)); border-color:transparent; color:#fff; }
.cta-phone { background:#0f8a4b; border-color:#0f8a4b; color:#fff; }
.cta-map { background:#fff; color:#173f82; }
.cta-reserve { background:linear-gradient(135deg,#10233f,#b8954b); border-color:transparent; color:#fff; }
.cta-list { background:linear-gradient(135deg,#10233f,#b8954b); border-color:transparent; color:#fff; }
.action-panel { border:1px solid rgba(219,229,244,.92); border-radius:28px; padding:26px; background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(244,248,255,.86)); margin:26px 0; box-shadow:var(--shadow-sm); }
.action-panel h2 { font-size:22px; margin-bottom:8px; }
table { width:100%; border-collapse:collapse; }
th,td { padding:10px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; word-break:break-all; }
.note { color:var(--muted); font-size:14px; }
.fixed-cta { display:none; }
.footer { padding:30px 20px 48px; background:#f8fafc; color:var(--muted); border-top:1px solid var(--line); }
body.design-simple { --brand:#111827; --brand-2:#4b5563; --accent:#6b7280; --soft:#f9fafb; background:#fff; }
body.design-simple .hero { background:linear-gradient(135deg,#fff,#f5f5f5); }
body.design-simple .card, body.design-simple .action-panel { background:#fff; box-shadow:0 8px 24px rgba(17,24,39,.06); }
body.design-warm { --brand:#6b3f25; --brand-2:#b8783e; --accent:#d6a15d; --soft:#fff8ef; background:linear-gradient(180deg,#fffaf3,#fff); }
body.design-warm .hero { background:radial-gradient(circle at 20% 10%,rgba(216,161,93,.22),transparent 30%),linear-gradient(135deg,#fffaf3,#f8eee0); }
body.design-warm .header-image { background:#f2dfc7; box-shadow:0 30px 80px rgba(107,63,37,.18); }
body.design-modern { --brand:#155eef; --brand-2:#06b6d4; --accent:#7c3aed; --soft:#f7fbff; background:linear-gradient(180deg,#f8fbff,#fff); }
body.design-modern .hero { background:radial-gradient(circle at 12% 8%,rgba(6,182,212,.18),transparent 30%),radial-gradient(circle at 90% 4%,rgba(124,58,237,.14),transparent 34%),linear-gradient(135deg,#fff,#eef6ff); }
body.design-modern .header-image { background:#eaf2ff; box-shadow:0 32px 90px rgba(37,99,235,.22); }
@media (max-width:760px){
  .site-header .wrap { align-items:flex-start; flex-direction:column; gap:10px; }
  .nav { justify-content:flex-start; gap:12px; }
  .hero-inner,.grid,.info-list,.check-list,.used-list,.gallery-grid,.feature-list,.flow-list{grid-template-columns:1fr;}
  .hero { padding:48px 18px 52px; }
  .hero p { font-size:16px; }
  .header-image img,.hero-placeholder { height:300px; min-height:300px; }
  .btn { width:100%; min-height:48px; font-size:16px; }
  body { padding-bottom:86px; }
  .fixed-cta { position:fixed; left:0; right:0; bottom:0; z-index:20; display:flex; gap:8px; padding:10px; background:rgba(255,255,255,.96); border-top:1px solid var(--line); box-shadow:0 -8px 24px rgba(15,23,42,.12); }
  .fixed-cta .btn { min-height:46px; padding:8px 10px; font-size:14px; }
}