:root { --ink:#17211d; --muted:#68736d; --paper:#fff; --soft:#f2f6f3; --brand:#177253; --accent:#e8b44c; --line:#dfe6e2; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--theme-font); letter-spacing:0; }
.visual-editor-mode [data-edit-key] { outline:2px dashed rgba(232,173,62,.75);outline-offset:5px;cursor:text;transition:outline-color .15s,background .15s; }
.visual-editor-mode [data-edit-key]:hover,.visual-editor-mode [data-edit-key]:focus { outline:3px solid #e8ad3e;background:rgba(255,243,191,.3); }
.visual-editor-mode [data-edit-key]:focus { box-shadow:0 0 0 6px rgba(232,173,62,.18); }
.visual-editor-mode [data-logo-placeholder] { position:relative;cursor:help;outline:2px dashed rgba(232,173,62,.75);outline-offset:4px; }
.visual-editor-mode [data-logo-placeholder]::before { content:"Logo placeholder";position:absolute;z-index:50;left:0;bottom:calc(100% + 12px);width:max-content;max-width:260px;padding:7px 10px;border-radius:4px;background:#17211d;color:#fff;font:700 11px/1.3 Arial,sans-serif;opacity:0;pointer-events:none;transform:translateY(5px);transition:opacity .16s,transform .16s; }
.visual-editor-mode [data-logo-placeholder]::after { content:"Your uploaded company logo will replace this letter icon. Use the logo upload field below the template.";position:absolute;z-index:49;left:0;top:calc(100% + 10px);width:245px;padding:11px 12px;border:1px solid #d99a16;border-radius:5px;background:#fff3bf;color:#3d2b02;box-shadow:0 8px 24px rgba(0,0,0,.16);font:500 11px/1.5 Arial,sans-serif;opacity:0;pointer-events:none;transform:translateY(-5px);transition:opacity .16s,transform .16s; }
.visual-editor-mode [data-logo-placeholder]:hover::before,.visual-editor-mode [data-logo-placeholder]:focus::before,.visual-editor-mode [data-logo-placeholder]:hover::after,.visual-editor-mode [data-logo-placeholder]:focus::after { opacity:1;transform:translateY(0); }
a { color:inherit; }
.demo-bar { min-height:34px; display:flex; align-items:center; justify-content:center; gap:14px; padding:6px 20px; background:#111; color:#fff; font:500 11px/1.4 Arial,sans-serif; }
.demo-bar span { color:#aaa; }.demo-bar a { position:absolute; right:20px; color:#fff; text-decoration:none; }.demo-bar a:hover { text-decoration:underline; }
.site-nav { position:relative; z-index:10; height:78px; max-width:1240px; margin:auto; padding:0 32px; display:flex; align-items:center; justify-content:space-between; background:var(--paper); }
.logo { display:flex; align-items:center; gap:10px; font-size:15px; font-weight:800; text-decoration:none; }.logo em { color:var(--brand); font-style:normal; }.logo-icon { display:grid; place-items:center; width:34px; height:34px; background:var(--brand); color:#fff; border-radius:4px; }
.nav-links { display:flex; align-items:center; gap:30px; }.nav-links a { color:var(--muted); font-size:13px; font-weight:600; text-decoration:none; }.nav-links a:hover { color:var(--brand); }.nav-links .nav-cta { padding:11px 16px; border:1px solid var(--brand); color:var(--brand); }
.menu-toggle { display:none; border:0; background:transparent; color:var(--ink); font-size:24px; cursor:pointer; }
.hero { min-height:700px; display:grid; grid-template-columns:1.05fr .95fr; background:var(--soft); }.hero-copy { order:-1; display:flex; flex-direction:column; justify-content:center; padding:80px max(7vw,32px); }.hero-image { min-height:540px; background-image:var(--hero-image); background-position:center; background-size:cover; }
.kicker { margin:0 0 18px; color:var(--brand); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0; }.hero h1 { max-width:720px; margin:0; font-size:clamp(44px,5.2vw,76px); line-height:1.02; letter-spacing:0; }.lead { max-width:630px; margin:25px 0 32px; color:var(--muted); font-size:17px; line-height:1.7; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; }.primary-button { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:0 22px; background:var(--brand); color:#fff; font-size:13px; font-weight:700; text-decoration:none; }.text-link { color:var(--ink); font-size:13px; font-weight:700; text-decoration:none; }.text-link span { margin-left:8px; color:var(--brand); }
.proof { display:flex; flex-wrap:wrap; gap:28px; margin-top:55px; padding-top:22px; border-top:1px solid var(--line); }.proof span { display:flex; flex-direction:column; color:var(--muted); font-size:10px; text-transform:uppercase; }.proof strong { color:var(--ink); font-size:18px; }
main > section { padding:100px max(7vw,32px); }.section-intro { max-width:650px; }.section-intro h2,.process h2,.contact h2 { margin:0; font-size:clamp(32px,4vw,52px); line-height:1.1; }.about { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:10vw; }.about-copy { max-width:600px; color:var(--muted); font-size:16px; line-height:1.8; }.about-copy .text-link { display:inline-block; margin-top:15px; color:var(--ink); }
.services { background:var(--soft); }.service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:45px; }.service-grid article { position:relative; min-height:300px; padding:28px; border:1px solid var(--line); background:var(--paper); }.service-number { position:absolute; top:20px; right:20px; color:#aab3ae; font-size:11px; }.service-icon { display:grid; place-items:center; width:46px; height:46px; margin-bottom:45px; background:var(--soft); color:var(--brand); font-weight:800; }.service-grid h3 { margin:0 0 12px; font-size:19px; }.service-grid p { color:var(--muted); font-size:13px; line-height:1.65; }.service-grid a { display:inline-block; margin-top:14px; color:var(--brand); font-size:11px; font-weight:700; text-decoration:none; }
.process { display:grid; grid-template-columns:.8fr 1.2fr; gap:10vw; align-items:center; }.process-copy > p:last-child { max-width:520px; color:var(--muted); line-height:1.7; }.process ol { margin:0; padding:0; list-style:none; }.process li { display:flex; gap:20px; padding:24px 0; border-bottom:1px solid var(--line); }.process li > span { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; border-radius:50%; background:var(--brand); color:#fff; font-size:12px; }.process li strong { font-size:16px; }.process li p { margin:5px 0 0; color:var(--muted); font-size:13px; }
.testimonial { text-align:center; background:var(--ink); color:#fff; }.quote-mark { margin:0; color:var(--accent); font:700 70px/1 Georgia,serif; }.testimonial blockquote { max-width:880px; margin:0 auto 28px; font-size:clamp(24px,3vw,38px); line-height:1.4; }.client { display:flex; flex-direction:column; font-size:12px; }.client span { margin-top:4px; color:#aeb9b3; }
.contact { display:flex; align-items:center; justify-content:space-between; gap:50px; background:var(--accent); }.contact > div { max-width:720px; }.contact .kicker { color:var(--ink); }.contact p:last-child { color:#3c443f; }.contact .primary-button { flex:0 0 auto; background:var(--ink); }
footer { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:34px max(7vw,32px); background:#101713; color:#9da9a2; font-size:11px; }footer .logo { color:#fff; }footer .logo-icon { background:var(--accent); color:var(--ink); }

/* 02: airy minimal layout */
.theme-clarity { --ink:#10263a;--muted:#6c7a86;--soft:#f6f8fa;--brand:#2679b8;--accent:#b9e4f7;--line:#dbe5eb; }.theme-clarity .site-nav { height:92px; }.theme-clarity .hero { min-height:650px; grid-template-columns:1fr 1fr; background:#fff; }.theme-clarity .hero-copy { padding-left:max(10vw,32px); }.theme-clarity .hero-image { margin:30px 30px 30px 0; border-radius:6px; }.theme-clarity .service-grid article { border:0; border-top:3px solid var(--brand); }.theme-clarity .service-icon { border-radius:50%; }.theme-clarity .testimonial { background:#eaf5fa;color:var(--ink); }.theme-clarity .client span { color:var(--muted); }

/* 03: energetic red hero */
.theme-guardian { --ink:#201b1b;--muted:#736a68;--soft:#f8f3f0;--brand:#c4382c;--accent:#f1c75b;--line:#e5dcd8; }.theme-guardian .hero { position:relative; display:block; min-height:760px; color:#fff; }.theme-guardian .hero-image { position:absolute; inset:0; background-position:center 35%; }.theme-guardian .hero-image::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(25,12,10,.88),rgba(25,12,10,.15)); }.theme-guardian .hero-copy { position:relative; min-height:760px; max-width:780px; }.theme-guardian .lead,.theme-guardian .proof span { color:#eee; }.theme-guardian .proof { border-color:rgba(255,255,255,.3); }.theme-guardian .proof strong,.theme-guardian .text-link { color:#fff; }.theme-guardian .service-grid { grid-template-columns:1fr 1fr; }.theme-guardian .service-grid article { min-height:240px; }.theme-guardian .service-icon { margin-bottom:24px; }.theme-guardian .contact { color:#fff;background:var(--brand); }.theme-guardian .contact .kicker,.theme-guardian .contact p:last-child { color:#fff; }

/* 04: magazine editorial */
.theme-editorial { --ink:#24221f;--muted:#746f68;--soft:#f3f0e9;--brand:#6d4d3a;--accent:#d2c2a6;--line:#d8d1c5; }.theme-editorial .site-nav { border-bottom:1px solid var(--ink); }.theme-editorial .hero { grid-template-columns:.85fr 1.15fr;background:var(--paper); }.theme-editorial .hero-copy { padding-right:5vw; }.theme-editorial .hero h1 { font-family:Lora,serif;font-weight:500; }.theme-editorial .hero-image { margin:50px 5vw 50px 0; }.theme-editorial .section-intro h2,.theme-editorial .process h2,.theme-editorial .contact h2 { font-family:Lora,serif;font-weight:500; }.theme-editorial .service-grid { gap:0;border-top:1px solid var(--ink); }.theme-editorial .service-grid article { border:0;border-right:1px solid var(--line);background:transparent; }.theme-editorial .testimonial blockquote { font-family:Lora,serif; }.theme-editorial .contact { background:var(--soft);border-top:1px solid var(--ink); }

/* 05: rounded and welcoming */
.theme-careline { --ink:#25322f;--muted:#6a7773;--soft:#edf7f3;--brand:#178a69;--accent:#ffcf70;--line:#d6e6df; }.theme-careline .logo-icon,.theme-careline .primary-button,.theme-careline .nav-cta { border-radius:999px; }.theme-careline .hero { margin:0 22px;border-radius:24px;overflow:hidden; }.theme-careline .hero-copy { order:0; }.theme-careline .hero-image { order:-1;margin:24px;border-radius:18px; }.theme-careline .service-grid article { border:0;border-radius:18px;box-shadow:0 12px 35px rgba(25,75,57,.07); }.theme-careline .service-icon { border-radius:14px; }.theme-careline .process li > span { border-radius:12px; }.theme-careline .contact { margin:30px;border-radius:22px; }.theme-careline .testimonial { margin:0 22px;border-radius:24px; }

/* 06: structured corporate */
.theme-assure { --ink:#15243c;--muted:#647184;--soft:#f1f4f8;--brand:#1c4f91;--accent:#2eb7a5;--line:#d5dde8; }.theme-assure .site-nav { max-width:none;padding-left:6vw;padding-right:6vw;border-bottom:1px solid var(--line); }.theme-assure .hero { min-height:620px;grid-template-columns:1.2fr .8fr; }.theme-assure .hero h1 { font-size:clamp(40px,4.7vw,66px); }.theme-assure .hero-image { clip-path:polygon(15% 0,100% 0,100% 100%,0 100%); }.theme-assure .service-grid article { border-top:4px solid var(--brand); }.theme-assure .service-number { font-size:24px;font-weight:700;color:#d5dde8; }.theme-assure .testimonial { background:var(--brand); }.theme-assure .contact { background:#e8eef7; }

/* 07: luxury dark */
.theme-northstar { --ink:#f3f0e8;--muted:#aaa89f;--paper:#111716;--soft:#18211f;--brand:#b9a269;--accent:#d7c181;--line:#303b38; }.theme-northstar .site-nav { background:var(--paper); }.theme-northstar .hero { position:relative;display:block;min-height:780px; }.theme-northstar .hero-image { position:absolute;inset:0;filter:grayscale(100%);opacity:.5; }.theme-northstar .hero-image::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,#111716 0%,transparent 75%); }.theme-northstar .hero-copy { position:relative;min-height:780px;max-width:850px; }.theme-northstar .primary-button { color:#111;background:var(--brand); }.theme-northstar .proof strong,.theme-northstar .text-link { color:var(--ink); }.theme-northstar .service-grid article { background:#151d1b; }.theme-northstar .testimonial { background:#b9a269;color:#111716; }.theme-northstar .client span { color:#4d493e; }.theme-northstar .contact { color:#111716; }.theme-northstar .contact .kicker,.theme-northstar .contact p:last-child { color:#333; }

/* 08: playful modular grid */
.theme-mosaic { --ink:#1b2440;--muted:#68708a;--soft:#f1f2fb;--brand:#5d45d8;--accent:#ffbc54;--line:#dcdef0; }.theme-mosaic .hero { margin:20px;min-height:680px;border-radius:6px;overflow:hidden; }.theme-mosaic .hero-copy { background:#ded8ff; }.theme-mosaic .hero-image { margin:20px;border-radius:5px; }.theme-mosaic .service-grid { grid-template-columns:1fr 1fr; }.theme-mosaic .service-grid article:nth-child(1) { background:#ded8ff; }.theme-mosaic .service-grid article:nth-child(2) { background:#d8f1ed; }.theme-mosaic .service-grid article:nth-child(3) { background:#ffe4c2; }.theme-mosaic .service-grid article:nth-child(4) { background:#f5d9e7; }.theme-mosaic .service-grid article { border:0;min-height:230px; }.theme-mosaic .service-icon { margin-bottom:22px;background:#fff;border-radius:50%; }.theme-mosaic .testimonial { background:#5d45d8; }.theme-mosaic .contact { background:#ffbc54; }

/* 09: warm family-focused */
.theme-renew { --ink:#394139;--muted:#747d73;--soft:#f5f3ea;--brand:#527851;--accent:#e9a66a;--line:#deddd4; }.theme-renew .hero { display:flex;position:relative;min-height:720px;align-items:end;background:var(--paper); }.theme-renew .hero-image { position:absolute;inset:0 0 0 42%; }.theme-renew .hero-image::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,transparent 60%); }.theme-renew .hero-copy { position:relative;width:58%;min-height:720px; }.theme-renew .hero h1 { font-family:Lora,serif;font-weight:500; }.theme-renew .service-grid article { border:0;border-bottom:3px solid var(--accent); }.theme-renew .service-icon { border-radius:50%; }.theme-renew .testimonial { background:#527851; }.theme-renew .contact { background:#f0c39d; }

/* 10: digital dashboard visual language */
.theme-pulse { --ink:#eaf8f3;--muted:#9bb7ad;--paper:#081512;--soft:#10241f;--brand:#42d89b;--accent:#9fffce;--line:#244039; }.theme-pulse .site-nav { background:var(--paper);border-bottom:1px solid var(--line); }.theme-pulse .logo-icon { color:#081512; }.theme-pulse .hero { position:relative;grid-template-columns:1.15fr .85fr; }.theme-pulse .hero-copy { background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:42px 42px; }.theme-pulse .hero-image { margin:38px;border:1px solid var(--line);box-shadow:14px 14px 0 var(--brand); }.theme-pulse .primary-button { color:#081512; }.theme-pulse .text-link,.theme-pulse .proof strong { color:var(--ink); }.theme-pulse .service-grid article { background:#0c1c18; }.theme-pulse .service-icon { background:var(--brand);color:#081512; }.theme-pulse .testimonial { background:var(--brand);color:#081512; }.theme-pulse .client span { color:#1f5542; }.theme-pulse .contact { color:#081512; }.theme-pulse .contact .kicker,.theme-pulse .contact p:last-child { color:#153f31; }

@media (max-width:900px) {
  .site-nav { padding:0 22px; }.menu-toggle { display:block; }.nav-links { display:none;position:absolute;top:72px;left:16px;right:16px;align-items:stretch;flex-direction:column;gap:0;padding:12px;background:var(--paper);border:1px solid var(--line);box-shadow:0 16px 40px rgba(0,0,0,.12); }.nav-links.open { display:flex; }.nav-links a { padding:13px; }.nav-links .nav-cta { margin-top:5px;text-align:center; }
  .hero,.theme-clarity .hero,.theme-assure .hero { grid-template-columns:1fr; }.hero-copy { order:0;padding:60px 28px; }.hero-image,.theme-clarity .hero-image,.theme-assure .hero-image { order:-1;min-height:420px;margin:0;clip-path:none; }.about,.process { grid-template-columns:1fr;gap:40px; }.service-grid { grid-template-columns:1fr 1fr; }.contact { align-items:flex-start;flex-direction:column; }
  .theme-guardian .hero-copy,.theme-northstar .hero-copy { min-height:700px; }.theme-renew .hero { display:block; }.theme-renew .hero-image { position:relative;inset:auto;min-height:430px; }.theme-renew .hero-image::after { background:linear-gradient(0deg,#fff,transparent 60%); }.theme-renew .hero-copy { width:100%;min-height:auto; }
}
@media (max-width:560px) {
  .demo-bar { justify-content:flex-start; }.demo-bar a { right:12px; }.demo-bar strong { display:none; }.site-nav { height:70px; }.hero h1 { font-size:39px; }.hero-image { min-height:330px; }.proof { gap:18px; }.service-grid,.theme-guardian .service-grid,.theme-mosaic .service-grid { grid-template-columns:1fr; }.service-grid article { min-height:240px; }.testimonial blockquote { font-size:23px; }main > section { padding:72px 24px; }.theme-careline .hero,.theme-careline .testimonial { margin:0 10px; }.theme-careline .contact { margin:10px; }.theme-mosaic .hero { margin:10px; }.theme-pulse .hero-image { margin:20px; }
  footer { align-items:flex-start;flex-direction:column; }
}