:root{--primary:#1f3a5f;--accent:#d4a53c;--bg:#ffffff;--text:#1a1a1a;--muted:#5f6670;--line:#e6e8eb;--radius:14px;--max:1100px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--text);background:var(--bg);line-height:1.55;-webkit-font-smoothing:antialiased}
img,video{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;line-height:1.15;margin:0 0 .5em;color:var(--primary)}
h1{font-size:clamp(2rem,5vw,3.2rem)}
h2{font-size:clamp(1.5rem,3.5vw,2.1rem)}
h3{font-size:1.15rem;font-family:inherit}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.eyebrow{display:inline-block;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:.6rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.4rem;border-radius:999px;background:var(--primary);color:#fff;text-decoration:none;font-weight:600;border:0;cursor:pointer;transition:transform .15s,opacity .15s}
.btn:hover{transform:translateY(-1px);opacity:.95}
.btn.ghost{background:transparent;color:var(--primary);border:2px solid var(--primary)}
.btn.accent{background:var(--accent);color:#111}
header.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:1rem}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;font-weight:700;color:var(--primary)}
.brand img{height:40px;width:auto}
nav.main{display:flex;gap:1.4rem;font-size:.95rem}
nav.main a{text-decoration:none;color:var(--text);opacity:.8}
nav.main a:hover,nav.main a[aria-current]{opacity:1;color:var(--primary);font-weight:600}
nav.main .cta{display:none}
@media (max-width:720px){nav.main a:not(.cta){display:none}nav.main .cta{display:inline-flex;padding:.55rem 1rem}}
.hero{position:relative;min-height:78vh;display:grid;align-items:end;color:#fff;isolation:isolate}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 30%,rgba(0,0,0,.72));z-index:-1}
.hero .wrap{padding-bottom:3.5rem;padding-top:6rem}
.hero .eyebrow{color:#fff;opacity:.9;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.hero h1{color:#fff;max-width:14ch}
.hero p{font-size:1.15rem;max-width:52ch;opacity:.95}
.hero .actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.4rem}
section{padding:4.5rem 0}
section.alt{background:color-mix(in srgb,var(--primary) 5%,var(--bg))}
.grid{display:grid;gap:1.4rem}
.grid.three{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.grid.two{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.card img{aspect-ratio:4/3;object-fit:cover;width:100%}
.card .body{padding:1.2rem 1.3rem 1.4rem}
.card h3{margin-bottom:.4rem}
.proofs{display:flex;flex-wrap:wrap;gap:.6rem .9rem;margin:1.2rem 0 0;padding:0;list-style:none}
.proofs li{padding:.5rem .9rem;border-radius:999px;background:color-mix(in srgb,var(--accent) 18%,var(--bg));font-size:.92rem;font-weight:600;color:var(--primary)}
.video{border-radius:var(--radius);overflow:hidden;background:#000;aspect-ratio:16/9;box-shadow:0 20px 50px rgba(0,0,0,.18)}
.video video{width:100%;height:100%}
.works{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem}
.works figure{margin:0;border-radius:var(--radius);overflow:hidden;position:relative;background:#eee}
.works img{aspect-ratio:1;object-fit:cover;width:100%;transition:transform .4s}
.works figure:hover img{transform:scale(1.04)}
.works figcaption{position:absolute;left:0;right:0;bottom:0;padding:.9rem 1rem;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff;font-size:.9rem}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:2.5rem}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr}}
.info{display:grid;gap:1rem}
.info a{color:var(--primary);font-weight:600;text-decoration:none}
.info .row{display:flex;gap:.8rem;align-items:flex-start}
.info .row span:first-child{width:28px;height:28px;border-radius:8px;background:color-mix(in srgb,var(--primary) 10%,var(--bg));display:grid;place-items:center;flex:none;color:var(--primary);font-weight:700}
form.contact{display:grid;gap:.9rem}
form.contact label{display:grid;gap:.3rem;font-size:.9rem;font-weight:600;color:var(--muted)}
form.contact input,form.contact textarea{font:inherit;padding:.8rem .95rem;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text)}
form.contact input:focus,form.contact textarea:focus{outline:2px solid color-mix(in srgb,var(--primary) 45%,transparent);border-color:var(--primary)}
form.contact .hp{position:absolute;left:-9999px}
.notice{padding:.9rem 1rem;border-radius:10px;background:color-mix(in srgb,var(--accent) 18%,var(--bg));font-size:.95rem}
.cta-band{background:var(--primary);color:#fff;text-align:center}
.cta-band h2{color:#fff}
.cta-band .btn{background:var(--accent);color:#111}
footer.site{border-top:1px solid var(--line);padding:2.2rem 0;font-size:.9rem;color:var(--muted)}
footer.site .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem}
footer.site a{text-decoration:none;color:inherit}
.legal{max-width:760px}
.legal h2{font-size:1.2rem;margin-top:2rem}

/* Demo-only presentation. Real client styles above remain unchanged. */
.example-page a,.example-page button{touch-action:manipulation}.example-page a:focus-visible,.example-page button:focus-visible,.example-page summary:focus-visible{outline:3px solid #b88a2e;outline-offset:4px}.example-page .lead{max-width:65ch;margin-bottom:2rem}.example-page .section-action{margin-top:1.6rem}.example-page .hero-secondary{background:#ffffffeb;color:#17354b;border:1px solid #fff}.example-page .hero .wrap{width:100%}.example-page .contact-grid{margin-top:1.5rem}.example-page .info{align-content:start}.example-page .info h2{font-size:1.2rem}.example-page .card h2{font:600 1.2rem/1.4 system-ui,sans-serif}.example-page .works figcaption{position:static;background:var(--bg);color:var(--text);display:grid;gap:.35rem;padding:1rem}.example-page .works figcaption small{font-size:12px;color:#52616b}.example-page .works figure{border:1px solid var(--line)}.example-page .works img{aspect-ratio:4/3;height:auto}.example-page .illustration{font-size:14px;line-height:1.6;color:#465661;margin-bottom:1.2rem}.example-page .video{margin-top:1rem}.example-page nav.main a{padding:.5rem .15rem;white-space:nowrap}.example-page .contact-example{border:0;padding:0;margin:1rem 0;display:grid;gap:1rem}.example-page .contact-example legend{font-size:14px;margin-bottom:1rem}.example-page .contact-example label{display:grid;gap:.35rem;font-size:14px}.example-page .contact-example input,.example-page .contact-example textarea{font:inherit;padding:.75rem;border:1px solid var(--line);border-radius:8px;background:#f7f8f9}.example-page .contact-example:disabled{opacity:1}.example-page .skip-link{position:absolute;left:1rem;top:-100px;background:#fff;color:#102f3d;padding:1rem;z-index:100}.example-page .skip-link:focus{top:1rem}.example-page .example-bar{background:#0e242e;color:#f6efe2;padding:16px 0}.example-page .example-bar>.wrap{display:flex;justify-content:space-between;align-items:center;gap:1rem}.example-page .agency-brand{font-size:15px;letter-spacing:2px;font-weight:700;text-decoration:none}.example-page .agency-brand span{font-size:12px;letter-spacing:1px}.example-page .example-bar p{font-size:12px;line-height:1.5;margin:5px 0 0;color:#e0e7e7}.example-page .example-price{font-size:14px;line-height:1.7;text-decoration:none;font-weight:600;text-align:right}.example-page .example-price span{font-size:12px;font-weight:400}.example-page .studio-offer{background:#eef3f3;color:#102e3a;scroll-margin-top:120px}.example-page .studio-offer .eyebrow{color:#435b64;font-size:12px}.example-page .offer-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:4rem}.example-page .offer-lead{font-size:17px;line-height:1.7}.example-page .included{padding-left:1.1rem;display:grid;gap:1rem}.example-page .offer-panel{background:#fff;border:1px solid #cbd8da;border-radius:14px;padding:2rem;align-self:start}.example-page .offer-price{font:400 64px/1.1 Georgia,serif;color:#153b4b;margin:0}.example-page .offer-price span{font:500 18px/1.5 system-ui,sans-serif}.example-page .offer-ttc{font-size:16px;color:#526772;margin:.5rem 0 1.5rem}.example-page .commitment{border-top:1px solid #dce4e5;padding-top:1.25rem}.example-page .offer-panel .btn{margin:1rem 0;background:#173e50}.example-page .contact-alternative{font-size:14px;line-height:1.8;overflow-wrap:anywhere}.example-page .offer-conditions{display:grid;grid-template-columns:1fr 1fr;gap:4rem;border-top:1px solid #cad7d9;padding-top:2rem;margin-top:2.5rem}.example-page .offer-conditions p{font-size:15px}.example-page .update-prices{margin:0 0 1rem}.example-page .update-prices>div{display:flex;justify-content:space-between;gap:1rem;padding:.45rem 0;border-bottom:1px solid #d6e0e1;font-size:15px}.example-page .update-prices dd{margin:0;font-weight:600;white-space:nowrap}.example-page .offer-faq{margin-top:2rem;border-top:1px solid #cad7d9;padding-top:1.25rem}.example-page .offer-faq summary{cursor:pointer;font-weight:600}.example-page .offer-faq p{margin-top:1rem;max-width:75ch}.example-page .publisher-footer{background:#0e242e;color:#e8eeee;padding:2rem 0;font-size:13px}.example-page .publisher-footer p{margin:.35rem 0;overflow-wrap:anywhere}.example-page .publisher-footer a{text-underline-offset:3px}.example-page .example-index{padding:3rem 0}.example-page .example-index .card a{display:block;padding:1.5rem;text-decoration:none}.example-page .example-index .card h2{margin:0 0 1rem}.example-page .legal-page{padding:3rem 20px;max-width:800px}.example-page .legal-page h2{margin-top:2rem}.example-page .legal-page li{margin-bottom:.5rem}.example-page .example-index img{width:100%;aspect-ratio:16/10;object-fit:cover}.example-page .example-index .price-intro{font-size:20px;margin-bottom:2rem}.example-page .example-index .price-intro small{font-size:16px}.example-page .source-credit{font-size:12px;color:var(--muted)}
@media(max-width:820px){.example-page .offer-grid,.example-page .offer-conditions{grid-template-columns:1fr;gap:1.5rem}.example-page .offer-panel{padding:1.5rem}.example-page .studio-offer{scroll-margin-top:130px}}@media(max-width:720px){.example-page header.top .wrap{height:auto;min-height:85px;flex-direction:column;align-items:flex-start;justify-content:center;padding-top:12px;padding-bottom:8px;gap:4px}.example-page .brand{font-size:16px}.example-page nav.main{display:flex;width:100%;justify-content:space-between;gap:8px;font-size:13px}.example-page nav.main a:not(.cta){display:block}.example-page nav.main .cta{display:none}.example-page .example-bar{padding:12px 0}.example-page .example-bar>.wrap{display:block}.example-page .example-price{display:inline-block;text-align:left;margin-top:6px;font-size:13px}.example-page .example-bar p,.example-page .example-price span{font-size:12px}.example-page .hero{min-height:560px}.example-page .hero .wrap{padding-top:3rem;padding-bottom:2rem}.example-page .hero p{font-size:16px}.example-page .hero h1{font-size:36px;max-width:17ch}.example-page .hero .actions .btn{font-size:14px;padding:.8rem 1rem}.example-page .grid.three,.example-page .grid.two{grid-template-columns:1fr}.example-page section{padding:3rem 0}.example-page .works{grid-template-columns:1fr}.example-page .offer-price{font-size:56px}.example-page .offer-price span{font-size:16px}.example-page .studio-offer .included{font-size:15px}.example-page .publisher-footer{font-size:13px}.example-page .example-index{padding:2rem 0}.example-page .example-index h1{font-size:32px}.example-page .example-index .grid{gap:1rem}}@media(prefers-reduced-motion:reduce){html:has(.example-page){scroll-behavior:auto}.example-page *{transition:none!important}}

@media(max-width:720px){.example-page .example-bar{padding:10px 0}.example-page .example-bar p{margin-top:3px}.example-page .example-price{margin-top:4px}.example-page header.top .wrap{min-height:78px}.example-page .hero{min-height:0}.example-page .hero .wrap{padding-top:1.75rem;padding-bottom:2rem}.example-page .hero::after{background:linear-gradient(180deg,rgba(0,0,0,.32),rgba(0,0,0,.67) 45%,rgba(0,0,0,.82))}}


/* Commercial review, October 2026: scoped to demonstrations. */
.example-page .demo-notice{padding:9px 0;background:#f1f3f3;color:#4e5c60;border-bottom:1px solid #dce3e4;font-size:12px}
.example-page .demo-notice .wrap{display:flex;justify-content:space-between;align-items:center;gap:.5rem 1.5rem}
.example-page .demo-notice p{margin:0}
.example-page .demo-notice a{white-space:nowrap;text-underline-offset:3px}
.example-page .studio-return{font-size:14px;text-underline-offset:3px}
.example-page .offer-intro-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:3rem}
.example-page .offer-intro h1{font-size:clamp(2rem,4vw,3rem)}
.example-page .offer-intro p{max-width:56ch}
.example-page .offer-preview{display:block;border-radius:14px;overflow:hidden;border:1px solid #cbd8da;text-decoration:none;background:#f3f6f6}
.example-page .offer-preview img{width:100%;aspect-ratio:4/3;object-fit:cover}
.example-page .offer-preview span{display:block;padding:1rem;font-size:14px}
.example-page .offer-intro-price{margin:1.5rem 0 .35rem;font-size:22px;color:#173b4b}
.example-page .offer-intro-price span{font-size:14px;white-space:nowrap}
.example-page .offer-intro-terms{font-size:14px}
.example-page .offer-detail-link{display:block;margin-top:1rem;font-size:14px;text-underline-offset:3px}
.example-page .example-choice{padding:1.5rem}
.example-page .example-index .example-choice a.btn{display:inline-flex;padding:.75rem 1.1rem}
.example-page .example-index .example-choice a.demo-link{padding:0;margin-top:1rem;text-decoration:underline;text-underline-offset:3px;font-size:14px}
@media(max-width:820px){.example-page .offer-intro-grid{grid-template-columns:1fr;gap:2rem}}
@media(max-width:720px){.example-page .demo-notice .wrap{flex-wrap:wrap}.example-page .demo-notice{font-size:11px}.example-page .studio-return{display:inline-block;margin-top:.5rem}}
.example-page .eyebrow{color:#75602c}
.example-page .hero .eyebrow{color:#fff}
.example-page .hero{min-height:520px}
.example-page .hero::after{background:linear-gradient(90deg,rgba(9,28,37,.87),rgba(9,28,37,.60) 42%,rgba(9,28,37,.08) 85%)}
.example-page .hero .wrap{padding-top:5rem;padding-bottom:4rem}
.example-page .hero h1{max-width:17ch}
.example-page .hero p{max-width:46ch;font-size:1.08rem}
.example-page .agency-action{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}
.example-page .agency-cta{padding:.65rem 1.1rem;background:#f5e7c7;color:#102e3a;font-size:14px;white-space:nowrap}
.example-page .example-price{text-align:left}
.example-page .video-grid{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:3rem}
.example-page .video-grid .video{margin:0;box-shadow:0 10px 30px rgba(14,36,46,.1)}
.example-page .video-grid p{max-width:35ch}
.example-page .works{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}
.example-page .works img{aspect-ratio:16/11}
.example-page .works figcaption{padding:1.1rem;gap:.45rem}
.example-page .home-services{margin-top:1.5rem}
.example-page .home-services{grid-template-columns:repeat(2,minmax(0,1fr))}
.example-page .project-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;list-style:none;padding:0;margin:2rem 0 0}
.example-page .project-steps li{border-top:1px solid #cbd8da;padding-top:1.25rem}
.example-page .step-number{display:block;color:#79602a;font:400 2.8rem/1.1 Georgia,serif;margin-bottom:1rem}
.example-page .project-steps h3{font-size:1.1rem;line-height:1.4}
.example-page .project-steps p,.example-page .trust-grid p{color:#465661;font-size:15px;margin-bottom:0}
.example-page .demo-trust{padding-top:0}
.example-page .trust-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin-top:1.5rem}
.example-page .trust-grid article{padding:1.25rem;border:1px dashed #b8c8cb;border-radius:12px;background:#f7f9f9}
.example-page .trust-grid h3{font-size:1rem}
.example-page .demo-call{position:relative;flex:none}
.example-page .demo-call summary{list-style:none;font-size:14px;padding:.65rem .95rem;white-space:nowrap}
.example-page .demo-call summary::-webkit-details-marker{display:none}
.example-page .demo-call summary span{border-left:1px solid #ffffff70;padding-left:.5rem;font-size:11px;font-weight:400}
.example-page .demo-call-explanation{position:absolute;right:0;top:calc(100% + 10px);width:320px;max-width:calc(100vw - 32px);padding:1.2rem;background:#fff;color:#182b35;border:1px solid #b8c8cb;border-radius:12px;box-shadow:0 12px 40px #0e242e26;white-space:normal;z-index:30;font-size:14px}
.example-page .demo-call-explanation p{margin:.6rem 0;line-height:1.6}
.example-page .demo-call-explanation a{font-weight:600;color:#173b4b;text-underline-offset:3px}
.example-page .demo-call--mobile{display:none}
.example-page .demo-phone-info{padding:1.25rem;background:#eef3f3;border-radius:12px}
.example-page .demo-phone-info .illustration{margin-bottom:0}
.example-page .offer-conditions .conditions-title{grid-column:1/-1;margin:0}
.example-page .offer-conditions{gap:1.25rem 3rem}
.example-page .offer-conditions h4{margin:0 0 .75rem;font-size:1rem}
@media(max-width:820px){.example-page .project-steps,.example-page .trust-grid{grid-template-columns:1fr;gap:1.25rem}.example-page .project-steps li{display:grid;grid-template-columns:48px 1fr;column-gap:1rem}.example-page .step-number{grid-row:1/3;font-size:2rem;margin:0}.example-page .project-steps p{grid-column:2}}
@media(max-width:720px){.example-page .home-services{grid-template-columns:1fr}.example-page .demo-call--header{display:none}.example-page .demo-call--mobile{display:block;position:fixed;bottom:max(14px,env(safe-area-inset-bottom));right:14px;z-index:40}.example-page .demo-call--mobile summary{box-shadow:0 5px 20px #0e242e40;min-height:48px;padding:.8rem 1.1rem}.example-page .demo-call--mobile .demo-call-explanation{top:auto;bottom:calc(100% + 10px)}.example-page:has(.demo-call--mobile) footer.site{padding-bottom:100px}}
.example-page .demo-confirmation summary{list-style:none}
.example-page .demo-confirmation summary::-webkit-details-marker{display:none}
.example-page .demo-confirmation[open] .notice{margin-top:1rem}
.example-page .demo-confirmation .notice p{margin:.5rem 0 0}
.example-page .demo-studio-link{display:inline-block;margin-top:1.25rem;font-weight:600;color:var(--primary);text-underline-offset:3px}
.example-page .studio-inquiry{border-top:1px solid #dce4e5;margin-top:1.5rem;padding-top:1.5rem;scroll-margin-top:90px}
.example-page .studio-inquiry h3{font-size:1.12rem}
.example-page .studio-inquiry>p{font-size:14px}
.example-page .studio-form{display:grid;gap:.8rem}
.example-page .studio-form label{display:flex;flex-wrap:wrap;gap:.3rem;font-size:14px;font-weight:600}
.example-page .studio-form input,.example-page .studio-form textarea{width:100%;min-width:0;font:inherit;padding:.75rem;border:1px solid #bdcbd0;border-radius:8px;color:#182b35;background:#fff}
.example-page .studio-form textarea{resize:vertical}
.example-page .studio-form .optional{font-weight:400}
.example-page .studio-form .btn{justify-content:center;margin:.25rem 0 0;font:600 14px/1.5 system-ui,sans-serif}
.example-page .studio-form .form-privacy{font-size:12px;color:#465661;margin:0}
.example-page .studio-form input:focus-visible,.example-page .studio-form textarea:focus-visible,.example-page .contact-example input:focus-visible,.example-page .contact-example textarea:focus-visible{outline:3px solid #91732f;outline-offset:2px}
.example-page .form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.example-page .offer-grid{gap:3rem}
.example-page .offer-steps{margin-top:2rem;padding:1.5rem;border:1px solid #ccd9db;border-radius:14px;background:#ffffff80}
.example-page .offer-steps ol{padding-left:1.2rem;margin-bottom:0;display:grid;gap:.6rem}
.example-page .contact-example input,.example-page .contact-example textarea{background:#fff;min-width:0;width:100%;color:var(--text)}
@media(max-width:820px){.example-page .video-grid{grid-template-columns:1fr;gap:1.5rem}.example-page .video-grid p{max-width:none}.example-page .offer-grid{gap:1.5rem}}
@media(max-width:720px){.example-page .agency-action{margin-top:.65rem;gap:.5rem 1rem;justify-content:space-between}.example-page .agency-action .example-price{margin:0;font-size:12px}.example-page .agency-cta{font-size:12px;padding:.5rem .8rem}.example-page .hero{min-height:0}.example-page .hero .wrap{padding-top:2.25rem;padding-bottom:2.5rem}.example-page .hero::after{background:linear-gradient(90deg,rgba(9,28,37,.88),rgba(9,28,37,.56))}.example-page .hero p{font-size:16px}.example-page .works{grid-template-columns:1fr}.example-page .works img{aspect-ratio:16/10}.example-page .studio-inquiry{scroll-margin-top:100px}.example-page .offer-steps{padding:1.1rem}}

/* One page: the artisan's website and MARDANTES speak in distinct areas. */
.example-page:has(.showcase-layout){background:#eef1f1}
.example-page .showcase-layout{display:grid;grid-template-columns:minmax(0,1fr) clamp(320px,28vw,420px);gap:24px;max-width:1720px;margin:0 auto;padding:24px;align-items:stretch}
.example-page .demo-frame{min-width:0;background:var(--bg);border:1px solid #d6dfe0;border-radius:12px;overflow:clip}
.example-page .demo-frame .wrap{padding-inline:clamp(20px,3vw,48px)}
.example-page .demo-frame .demo-notice{font-size:11px;line-height:1.7;background:#e3e9e9}
.example-page .demo-frame .demo-notice strong{font-size:12px;color:#243f49}
.example-page .demo-frame header.top .wrap{height:auto;min-height:76px;flex-wrap:wrap;padding-top:14px;padding-bottom:12px;gap:.6rem 1rem}
.example-page .demo-frame nav.main{order:3;display:flex;width:100%;justify-content:space-between;gap:10px;font-size:14px}
.example-page .demo-frame nav.main a:not(.cta){display:block}
.example-page .demo-frame .demo-call--mobile{display:none}
.example-page .demo-frame .demo-call--header{display:block;margin-left:auto}
.example-page .demo-frame section[id]{scroll-margin-top:115px}
.example-page .demo-frame .contact-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:2rem}
.example-page .studio-rail{min-width:0;background:#fff;border:1px solid #d9e1e2;border-radius:12px;color:#243b45;scroll-margin-top:16px}
.example-page .rail-sticky{position:sticky;top:16px;max-height:calc(100dvh - 32px);overflow-y:auto;scrollbar-width:thin;padding:28px}
.example-page .rail-brand{font-size:21px;letter-spacing:.11em;text-decoration:none;color:#133747;font-weight:750}
.example-page .rail-brand span{font-size:10px;letter-spacing:.2em;font-weight:500}
.example-page .rail-audience{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#66767c;margin:17px 0 8px}
.example-page .studio-rail h2{font-size:clamp(27px,2.4vw,34px);color:#153c4d;line-height:1.12;margin-bottom:16px}
.example-page .rail-price{font:400 56px/1 Georgia,serif;color:#153c4d;margin:0 0 7px}
.example-page .rail-price span{font:500 14px/1.4 system-ui,sans-serif;white-space:nowrap}
.example-page .rail-tax{font-size:12px;color:#5b6c74;margin-bottom:12px}
.example-page .rail-commitment{font-size:12px;line-height:1.5;margin:0 0 14px}
.example-page .rail-included{font-size:13px;padding-left:18px;display:grid;gap:4px;margin:0 0 18px}
.example-page .rail-cta{display:flex;justify-content:center;width:100%;font-size:14px;background:#153c4d}
.example-page .rail-no-order{font-size:11px;text-align:center;margin:7px 0 20px;color:#66767c}
.example-page .rail-comments{border-top:1px solid #e1e7e8;padding-top:18px}
.example-page .rail-comments h3{font:600 14px/1.45 system-ui,sans-serif;color:#153c4d;margin-bottom:10px}
.example-page .rail-comments p{font-size:12px;line-height:1.65;color:#5b6c74;margin-bottom:10px}
.example-page .studio-rail details{font-size:12px;border-top:1px solid #e1e7e8;padding-top:12px;margin-top:12px}
.example-page .studio-rail summary{cursor:pointer;font-weight:600;color:#244653;line-height:1.5;padding-bottom:5px}
.example-page .studio-rail details p{margin-top:10px}
.example-page .studio-rail dl>div{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px solid #edf0f0}
.example-page .studio-rail dd{margin:0;white-space:nowrap}
.example-page .showcase-inquiry{background:#fff;color:#243b45;border-top:1px solid #d9e1e2}
.example-page .showcase-inquiry>.wrap{max-width:780px}
.example-page .showcase-inquiry .studio-inquiry{scroll-margin-top:24px}
.example-page .showcase-inquiry h2,.example-page .showcase-inquiry h3{color:#153c4d}
.example-page .showcase-inquiry .btn{background:#153c4d}
.example-page .showcase-mobile-offer{display:none}
@media(max-width:1100px){.example-page .showcase-layout{grid-template-columns:1fr;padding:16px;gap:20px}.example-page .rail-sticky{position:static;max-height:none;overflow:visible;padding:28px}.example-page .studio-rail{scroll-margin-top:16px}.example-page .studio-rail h2 br{display:none}.example-page .showcase-mobile-offer{display:flex;position:fixed;bottom:max(14px,env(safe-area-inset-bottom));right:14px;z-index:40;background:var(--accent);color:#153c4d;box-shadow:0 5px 20px #0e242e40;font-size:13px;min-height:48px}.example-page:has(.showcase-layout) .publisher-footer{padding-bottom:100px}.example-page .demo-frame .video-grid{grid-template-columns:1fr;gap:1.5rem}}
@media(max-width:720px){.example-page .showcase-layout{padding:10px;gap:16px}.example-page .demo-frame .wrap{padding-inline:18px}.example-page .demo-frame header.top .wrap{flex-direction:row;align-items:center;gap:10px}.example-page .demo-frame .brand{font-size:14px}.example-page .demo-frame nav.main{font-size:12px;gap:6px}.example-page .demo-frame .demo-call summary{font-size:12px;padding:.55rem .7rem}.example-page .demo-frame .demo-call summary svg{width:14px;height:14px}.example-page .demo-frame .demo-call-explanation{max-width:calc(100vw - 60px)}.example-page .demo-frame .hero h1{font-size:34px}.example-page .demo-frame .hero .actions .btn{font-size:13px}.example-page .demo-frame .contact-grid{grid-template-columns:1fr;gap:2rem}.example-page .rail-sticky{padding:24px}.example-page .showcase-inquiry{padding:3rem 0}.example-page:has(.showcase-layout) footer.site{padding-bottom:2rem}}
.example-page:has(#offre:target) .showcase-mobile-offer,.example-page:has(#demande:target) .showcase-mobile-offer{display:none}