@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;600;700&family=Great+Vibes&family=Montserrat:wght@400;500;600;700;800&family=Playfair+Display:wght@500;600;700&family=Poppins:wght@400;500;600;700&display=swap');

:root{
  --bg:#f7f2ec;
  --ink:#181512;
  --muted:#756d65;
  --card:#fffaf4;
  --line:#e8dccf;
  --brand:#b9975b;
  --brand-dark:#806237;
  --danger:#b82727;
  --shadow: 0 24px 80px rgba(40, 28, 18, .13);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:linear-gradient(180deg,#fffaf4 0%,#f7f2ec 45%,#efe5da 100%);font-family:Poppins,Arial,sans-serif;color:var(--ink)}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:16px 5vw;background:rgba(255,250,244,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(232,220,207,.75)}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{width:42px;height:42px;border-radius:14px;background:#17120d;color:#f6dfad;display:grid;place-items:center;font-weight:800;font-family:Playfair Display,serif;font-size:24px;box-shadow:0 12px 30px rgba(0,0,0,.15)}
.brand strong{display:block;font-size:16px;line-height:1}
.brand span{display:block;color:var(--muted);font-size:12px;margin-top:4px}
nav{display:flex;gap:22px;color:#41372d;font-size:14px;font-weight:600}
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding:80px 5vw 52px;min-height:640px}
.eyebrow{letter-spacing:.16em;text-transform:uppercase;color:var(--brand-dark);font-size:12px;font-weight:800;margin:0 0 12px}
h1{font-family:Playfair Display,Georgia,serif;font-size:clamp(42px,6vw,78px);line-height:.94;margin:0 0 22px;max-width:840px}
.lead{font-size:18px;line-height:1.7;color:#5e554c;max-width:700px;margin:0 0 28px}
.hero-actions,.export-actions,.layer-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{border:1px solid var(--line);background:#fff;border-radius:999px;padding:12px 18px;color:#231d17;font-weight:700;cursor:pointer;box-shadow:0 8px 18px rgba(55,35,20,.06);transition:.18s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(55,35,20,.11)}
.btn.primary{background:#17120d;color:#fff;border-color:#17120d}
.btn.ghost{background:transparent}
.btn.small{font-size:13px;padding:9px 13px}
.btn.danger,.small.danger{color:#fff;background:var(--danger);border-color:var(--danger)}
.hero-card{display:grid;place-items:center;min-height:520px;border-radius:36px;background:radial-gradient(circle at 25% 20%,#ead3a4 0 12%,transparent 30%),linear-gradient(135deg,#1a1410,#402e20);box-shadow:var(--shadow);padding:34px;overflow:hidden;position:relative}
.hero-card:before,.hero-card:after{content:"";position:absolute;border:1px solid rgba(246,223,173,.28);border-radius:999px;width:380px;height:380px}.hero-card:before{right:-130px;top:-130px}.hero-card:after{left:-170px;bottom:-170px}
.mock-invite{position:relative;z-index:1;width:min(360px,80%);aspect-ratio:105/148;background:#fffaf2;border-radius:22px;padding:46px 28px;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.32);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px;border:1px solid #dfc183}
.mock-invite:before{content:"";position:absolute;inset:18px;border:1px solid #c9a45b;border-radius:16px}.mock-small{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#806237}.mock-invite h2{font-family:Great Vibes,cursive;font-size:56px;line-height:1;margin:0;color:#2a2118}.mock-invite p{margin:0;color:#756d65}.mock-invite i{width:62px;height:1px;background:#c9a45b;display:block}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:0 5vw 54px}.features article{background:rgba(255,250,244,.72);border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:0 12px 38px rgba(72,50,32,.07)}.features strong{display:block;margin-bottom:8px}.features span{color:var(--muted);font-size:14px;line-height:1.55}
.editor-section{display:grid;grid-template-columns:420px 1fr;gap:24px;padding:30px 5vw 70px;align-items:start}.panel,.stage-wrap,.guide{background:rgba(255,250,244,.78);border:1px solid var(--line);border-radius:28px;box-shadow:0 18px 60px rgba(68,48,30,.09)}.controls{padding:24px;position:sticky;top:90px}.panel-heading h2,.guide h2{font-family:Playfair Display,serif;font-size:30px;margin:0 0 6px}.panel-heading p{margin:0 0 20px;color:var(--muted);font-size:13px;line-height:1.55}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.controls label{display:flex;flex-direction:column;gap:8px;color:#443a31;font-size:13px;font-weight:700}.controls input,.controls select,.controls textarea{width:100%;border:1px solid #dfd2c3;background:#fff;border-radius:14px;padding:11px 12px;outline:none;color:#211b16}.controls input[type=color]{height:44px;padding:5px}.text-fields{display:grid;gap:12px;margin-top:18px}.controls textarea{resize:vertical}.advanced{margin:16px 0}.link-btn{border:0;background:transparent;padding:0;color:#7c5e33;font-weight:800;cursor:pointer}.advanced-body{display:none;margin-top:14px;border:1px dashed #dcc8ad;border-radius:18px;padding:14px;background:#fff7ed}.advanced-body.open{display:grid;gap:14px}.check{flex-direction:row!important;align-items:center}.check input{width:auto}.range input{padding:0}.note{font-size:12px;color:#877b70;line-height:1.45;margin:12px 0 0}.stage-wrap{padding:18px;min-width:0}.canvas-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:4px 4px 16px;color:#655b50;font-size:13px;flex-wrap:wrap}.stage{min-height:720px;border-radius:24px;background:linear-gradient(135deg,#e6d7c7,#fbf6ef);display:grid;place-items:center;padding:24px;overflow:auto}canvas{display:block;max-width:min(100%,600px);height:auto;background:#fff;box-shadow:0 28px 80px rgba(43,28,16,.22);border-radius:10px;cursor:grab}canvas.dragging{cursor:grabbing}.guide{margin:0 5vw 70px;padding:28px}.guide ol{margin:14px 0 0;padding-left:22px;color:#5f564e;line-height:1.8}footer{display:flex;justify-content:space-between;gap:18px;padding:30px 5vw;color:#766c63;border-top:1px solid rgba(232,220,207,.85);font-size:13px}
@media(max-width:1100px){.hero{grid-template-columns:1fr}.hero-card{min-height:420px}.editor-section{grid-template-columns:1fr}.controls{position:static}.features{grid-template-columns:1fr}}
@media(max-width:680px){nav{display:none}.hero{padding-top:48px}.control-grid{grid-template-columns:1fr}.stage{padding:12px;min-height:520px}.canvas-toolbar{align-items:flex-start}.features{padding-bottom:30px}.editor-section{padding-inline:16px}.topbar{padding-inline:16px}footer{flex-direction:column}.btn{width:100%;justify-content:center}.hero-actions .btn{width:auto}.export-actions .btn{width:100%}}
