:root { font-family:Arial,Helvetica,sans-serif; color:#211624; background:#fff; --accent:#275d47; --soft:#c6ecd4; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0; min-width:0; }
img { display:block; width:100%; height:auto; }
a { color:inherit; }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { overflow-wrap:anywhere; }
h1 { font-size:clamp(2rem,4.5vw,3.8rem); line-height:1.06; letter-spacing:-.045em; margin-bottom:20px; }
h2 { font-size:clamp(1.6rem,3vw,2.4rem); line-height:1.15; letter-spacing:-.035em; }
h3 { font-size:1.2rem; line-height:1.25; letter-spacing:-.025em; }
p { font-size:1rem; line-height:1.55; }
.demo-header { padding:20px clamp(18px,4vw,48px); border-bottom:1px solid #21162425; }
.demo-brand { font-size:1.35rem; font-weight:800; letter-spacing:-.04em; text-decoration:none; }
.demo-nav { display:flex; flex-wrap:wrap; gap:6px 20px; margin-top:12px; }
.demo-nav a { display:flex; align-items:center; min-height:44px; padding:8px 0; font-size:.95rem; line-height:1.3; text-decoration:none; border-bottom:2px solid transparent; }
.demo-nav a[aria-current="page"] { border-color:var(--accent); font-weight:700; }
.demo-content { padding:32px clamp(18px,4vw,48px); }
.demo-kicker { font-size:.875rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); margin-bottom:16px; }
.demo-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:28px; }
.demo-hero>img { aspect-ratio:1/1; object-fit:cover; }
.demo-action { display:inline-flex; justify-content:center; align-items:center; min-height:44px; padding:12px 18px; background:var(--accent); color:white; text-decoration:none; font-weight:700; line-height:1.4; }
.demo-feature-line { display:flex; flex-wrap:wrap; gap:10px 22px; padding-top:24px; margin-top:28px; border-top:1px solid #21162425; font-size:.95rem; line-height:1.5; }
.demo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.demo-grid article { padding:22px; background:var(--soft); }
.demo-grid article>p:last-child { margin-bottom:0; }
.demo-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.demo-gallery figure { margin:0; }
.demo-gallery img { aspect-ratio:1/1; object-fit:cover; }
.demo-gallery figcaption { padding-top:10px; font-size:.95rem; line-height:1.4; }
.demo-about { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px; align-items:center; }
.demo-about img { aspect-ratio:4/3; object-fit:cover; }
.demo-contact { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px; }
.demo-contact form { display:grid; gap:14px; }
.demo-contact label { display:grid; gap:7px; font-size:.95rem; line-height:1.4; }
.demo-contact input,.demo-contact textarea { display:block; width:100%; min-width:0; padding:12px; border:1px solid #21162450; border-radius:0; background:white; color:#211624; font-size:1rem; }
.demo-contact textarea { min-height:100px; resize:vertical; }
.demo-contact button { min-height:44px; padding:12px; border:0; background:var(--accent); color:#fff; font-weight:700; }
.demo-note { font-size:.875rem; line-height:1.5; color:#5c4d62; }
.demo-footer { padding:18px clamp(18px,4vw,48px); border-top:1px solid #21162425; font-size:.875rem; line-height:1.5; }
.theme-portfolio { --accent:#4c2b54; --soft:#ece7ef; }
.theme-portfolio .demo-brand { font-family:Georgia,serif; letter-spacing:.03em; font-weight:400; font-size:1.65rem; }
.theme-portfolio .demo-hero { position:relative; display:block; background:#211624; }
.theme-portfolio .demo-hero>img { aspect-ratio:16/9; filter:brightness(.67); }
.theme-portfolio .demo-hero-copy { position:absolute; inset:auto 28px 28px; max-width:70%; color:white; }
.theme-portfolio .demo-hero-copy h1 { font-family:Georgia,serif; letter-spacing:-.025em; }
.theme-portfolio .demo-hero-copy>p { margin-bottom:0; }
.theme-portfolio .demo-hero .demo-kicker { color:#c6ecd4; }
.theme-service .demo-header { background:#275d47; color:white; }
.theme-service .demo-nav a[aria-current="page"] { border-color:#c6ecd4; }
.theme-service .demo-hero { grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); }
.theme-service .demo-hero>img { grid-column:1; grid-row:1; aspect-ratio:4/5; }
.theme-service .demo-hero-copy { grid-column:2; grid-row:1; }
.theme-studio { --accent:#7652c5; --soft:#eae4f6; }
.theme-studio .demo-hero { display:flex; flex-direction:column; gap:20px; align-items:stretch; }
.theme-studio .demo-hero-copy { max-width:650px; }
.theme-studio .demo-hero-copy h1 { color:#4c2b54; }
.theme-studio .demo-hero>img { aspect-ratio:16/7; }
.theme-shop { --accent:#275d47; --soft:#c6ecd4; }
.theme-shop .demo-hero { padding:24px; background:var(--soft); }
.theme-shop .demo-hero>img { aspect-ratio:4/5; }
.demo-products { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.demo-products article { min-width:0; }
.demo-products img { aspect-ratio:4/3; object-fit:cover; }
.demo-products h2 { margin:14px 0 8px; font-size:1.2rem; }
.demo-products p { margin-bottom:0; font-size:.95rem; }
body.is-embedded .demo-footer { padding-block:14px; }
:focus-visible { outline:3px solid #7652c5; outline-offset:4px; }
@media(max-width:620px) {
 .demo-hero,.theme-service .demo-hero,.demo-about,.demo-contact { grid-template-columns:1fr; gap:22px; }
 .theme-service .demo-hero>img,.theme-service .demo-hero-copy { grid-column:auto; grid-row:auto; }
 .demo-hero>img,.theme-service .demo-hero>img,.theme-shop .demo-hero>img { aspect-ratio:16/10; }
 .demo-grid { grid-template-columns:1fr; }
 .demo-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .theme-portfolio .demo-hero-copy { max-width:none; inset:auto 20px 20px; }
 .theme-portfolio .demo-hero>img { aspect-ratio:4/5; }
 .theme-portfolio .demo-hero-copy h1 { font-size:clamp(2rem,7vw,3rem); }
 .theme-portfolio .demo-hero-copy>p { font-size:1rem; }
 .theme-shop .demo-hero { padding:20px; }
}
@media(max-width:380px) {
 .demo-header,.demo-content,.demo-footer { padding-inline:16px; }
 .demo-nav { gap:4px 16px; }
 .demo-nav a { font-size:.95rem; }
 .demo-gallery,.demo-products { grid-template-columns:1fr; }
 .theme-studio .demo-hero>img { aspect-ratio:4/3; }
}
@media(max-height:520px) and (orientation:landscape) and (min-width:621px) {
 .demo-header { padding-top:14px; padding-bottom:10px; }
 .demo-content { padding-top:24px; }
 .demo-hero>img,.theme-service .demo-hero>img { aspect-ratio:4/3; }
 .theme-portfolio .demo-hero>img { aspect-ratio:16/7; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }