*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;color:var(--ink);background:var(--paper);font-family:Arial,Helvetica,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;width:100%;height:auto}figure{margin:0}p{max-width:65ch}h1,h2,h3,p{margin-top:0}h1,h2{line-height:1.02;letter-spacing:-.055em}h1{font-size:clamp(3.2rem,6.5vw,6.4rem);margin-bottom:24px}h2{font-size:clamp(2.4rem,4vw,4rem)}h3{font-size:1.4rem;line-height:1.2}a:focus-visible,button:focus-visible{outline:3px solid currentColor;outline-offset:5px}.skip{position:absolute;left:-9999px}.skip:focus{left:15px;top:50px;padding:10px;background:white;color:#111;z-index:100}.demo-bar{position:relative;z-index:20;background:#101a16;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 3.5%;font:12px/1.5 Arial,sans-serif}.demo-bar a{text-decoration:underline;text-underline-offset:4px}.demo-bar>span{color:#c4d0c9}.demo-header{margin:0 auto;max-width:1440px;padding:30px 5%;display:flex;justify-content:space-between;align-items:center;gap:24px}.demo-brand{font-size:1.45rem;font-weight:800;letter-spacing:-.04em;line-height:1.2}.demo-brand span{display:block;font:10px/2 Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase}.demo-header nav{display:flex;gap:30px;font-size:13px}.demo-header nav a:hover{text-decoration:underline;text-underline-offset:5px}.hero{max-width:1440px;margin:auto;padding:55px 5% 75px}.hero.split,.garden,.consulting{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.hero .lead{font-size:1.15rem;max-width:40ch}.kicker{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;margin-bottom:24px}.action{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:15px 24px;background:var(--accent);color:var(--button-ink,var(--paper));font-size:13px;font-weight:700;border:1px solid transparent;max-width:100%;text-align:left}.action:hover{filter:brightness(.92)}.hero figcaption{font-size:11px;margin-top:12px;letter-spacing:.03em}.micro{font-size:11px;letter-spacing:.08em;margin-top:35px}.ticker{padding:20px 5%;border-block:1px solid var(--line);text-align:center;font-size:13px;letter-spacing:.12em}.services{max-width:1440px;margin:auto;padding:100px 5%}.section-heading{max-width:690px;margin-bottom:45px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.service-grid article{border-top:1px solid var(--line);padding-top:25px}.step{display:block;font-size:11px;margin-bottom:32px}.service-grid p{font-size:15px;opacity:.85}.closing{padding:85px 8%;text-align:center;background:var(--accent);color:var(--button-ink,var(--paper))}.closing h2{max-width:800px;margin-inline:auto}.closing p{margin-inline:auto}.closing .action{border-color:currentColor;margin-top:15px}.demo-footer{padding:30px 5%;display:flex;gap:20px;align-items:center;justify-content:space-between;font:12px/1.5 Arial,sans-serif}.demo-footer a{text-decoration:underline;text-underline-offset:4px}
/* 01 / Technical workshop: hard edges, industrial type, diagonal artwork. */
.garage{--paper:#161d19;--ink:#eef3e9;--accent:#c8ff35;--button-ink:#161d19;--line:#3a463b}.garage h1{font-family:Arial,sans-serif;font-weight:900;text-transform:uppercase;font-size:clamp(3.2rem,5.5vw,5.6rem);line-height:.94}.garage .hero figure{transform:rotate(-3deg);border:1px solid #c8ff35;padding:8px}.garage .hero figcaption{padding:12px 8px}.garage .step,.garage .kicker{color:#c8ff35}.garage .ticker{background:#c8ff35;color:#161d19;text-transform:uppercase;font-weight:bold}.garage .service-grid h3{text-transform:uppercase}.garage .closing .kicker{color:inherit}
/* 02 / Dining: quiet centered masthead, circular plate and narrow side note. */
.restaurant{--paper:#f3eddf;--ink:#343c2b;--accent:#3e4c33;--line:#b4b5a4}.restaurant .demo-brand{font-family:Georgia,serif;letter-spacing:.12em;font-size:2rem}.restaurant h1,.restaurant h2,.restaurant h3{font-family:Georgia,serif;font-weight:400;letter-spacing:-.045em}.dining{display:grid;grid-template-columns:1.5fr .55fr;column-gap:60px;padding-top:20px}.dining-title{grid-column:1/-1;text-align:center;z-index:1}.dining-title h1{font-size:clamp(4rem,8.8vw,9rem);line-height:.9}.dining-title .kicker{margin-inline:auto}.dining figure img{border-radius:50% 50% 0 0}.dining-note{align-self:center;padding-top:40px}.dining figcaption{text-align:center}.restaurant .service-grid{text-align:center;gap:60px}.restaurant .step{font-family:Georgia,serif;font-style:italic;font-size:1.2rem}.restaurant .closing{background:#dedfc8;color:#343c2b}.restaurant .closing .action{color:#fff}
/* 03 / Fashion: oversized headline layered above a portrait and narrow copy. */
.coiffure{--paper:#ffb5c5;--ink:#39162f;--accent:#39162f;--line:#a97891}.coiffure .demo-brand{letter-spacing:-.07em;font-size:1.8rem}.fashion{display:grid;grid-template-columns:1.35fr .65fr;column-gap:50px;padding-top:20px}.fashion>div:first-child{grid-column:1/-1;z-index:2}.fashion h1{font-size:clamp(3.4rem,8.4vw,8.5rem);font-weight:900;line-height:.86;letter-spacing:-.075em}.fashion figure{margin-top:5px;margin-left:20%;}.fashion figure img{border-radius:180px 180px 0 0}.fashion-note{align-self:end;padding-bottom:30px}.coiffure .ticker{background:#39162f;color:#ffb5c5;font-weight:bold}.coiffure .service-grid{grid-template-columns:1fr}.coiffure .service-grid article{display:grid;grid-template-columns:50px 1fr 1fr;gap:30px;align-items:start}.coiffure .services{padding-block:80px}.coiffure .step{margin:0}.coiffure .closing{background:#f4ebd9;color:#39162f}.coiffure .closing .action{color:#ffb5c5}
/* 04 / Garden: organic borders, asymmetry and spacious serif headings. */
.paysagiste{--paper:#f4f2e6;--ink:#294b36;--accent:#294b36;--line:#c0cbb0}.paysagiste h1,.paysagiste h2,.paysagiste h3{font-family:Georgia,serif;font-weight:400}.garden{grid-template-columns:1fr 1.05fr;gap:70px;padding-block:70px}.garden figure{padding-top:40px}.garden figure img{border-radius:48% 48% 18px 18px}.garden h1{font-size:clamp(3.8rem,6vw,6rem)}.paysagiste .service-grid article{border:0;background:#e4e9d5;border-radius:8px 60px 8px 8px;padding:28px}.paysagiste .ticker{border:0;background:#e4e9d5}.paysagiste .closing{border-radius:100px 100px 0 0;margin:0 4%}
/* 05 / Plumbing: fast task entry, blue technical drawing, utility cards. */
.plomberie{--paper:#f7fbff;--ink:#123660;--accent:#1456c4;--line:#bacfe8}.utility{display:grid;grid-template-columns:1.05fr 1fr;gap:30px}.utility h1{font-size:clamp(3.3rem,5.5vw,5.4rem);letter-spacing:-.05em}.utility figure{grid-column:2;grid-row:1/3;align-self:center}.utility aside{display:grid;gap:8px;max-width:500px}.utility aside strong{font-size:12px}.utility aside a{border:1px solid #c3d7ee;border-radius:5px;padding:11px 15px;background:white;font-size:13px}.plomberie .action{border-radius:6px}.plomberie .ticker{background:#e4f1fc;border:0}.plomberie .service-grid article{border:1px solid #bacfe8;border-radius:12px;padding:28px}.plomberie .step{background:#e4f1fc;border-radius:50%;width:40px;height:40px;display:grid;place-items:center}
/* 06 / Property: editorial headline above a panoramic architectural scene. */
.immobilier{--paper:#f4f0e8;--ink:#3e392f;--accent:#3e392f;--line:#c9bfae}.immobilier .demo-brand{font-family:Georgia,serif;font-weight:400;letter-spacing:.07em}.immobilier h1,.immobilier h2,.immobilier h3{font-family:Georgia,serif;font-weight:400}.property{padding-top:25px}.property-title{display:grid;grid-template-columns:1.2fr 1fr;column-gap:70px;align-items:center}.property-title .kicker{grid-column:1/-1}.property-title h1{grid-row:2/4;font-size:clamp(3.5rem,6.2vw,6.2rem)}.property-title .lead{align-self:end}.property-title .action{justify-self:start;margin-bottom:25px}.property figure img{max-height:580px;object-fit:cover;margin-top:20px}.property figcaption{display:flex;justify-content:space-between;gap:20px}.immobilier .ticker{font-family:Georgia,serif;font-size:1.5rem;letter-spacing:0}.immobilier .step{font-family:Georgia,serif;font-size:2rem;margin-bottom:12px}
/* 07 / Sport: compressed type, circular motion and vertical caption. */
.sport{--paper:#202321;--ink:#f0f2e6;--accent:#dbfe45;--button-ink:#202321;--line:#52584e}.sport .demo-brand{font-style:italic;font-size:1.8rem}.athletic{position:relative;display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:30px}.athletic h1{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:clamp(4.5rem,9.5vw,10rem);font-weight:900;letter-spacing:-.05em;line-height:.9;transform:skew(-5deg)}.athletic figure img{border-radius:50%;aspect-ratio:1;object-fit:cover}.vertical-word{position:absolute;right:2%;writing-mode:vertical-rl;font-size:11px;letter-spacing:.2em}.sport .ticker{background:#dbfe45;color:#202321;font-weight:bold;transform:rotate(-1deg)}.sport .services h2{text-transform:uppercase}.sport .step{color:#dbfe45;font-size:2rem;font-weight:900}.sport .closing h2{font-weight:900;text-transform:uppercase}
/* 08 / Bakery: centered warm masthead, illustrated loaf and stamp. */
.boulangerie{--paper:#f8ebd4;--ink:#774223;--accent:#8c4225;--line:#ceb18b}.boulangerie .demo-brand{font-family:Georgia,serif;font-size:2.4rem;font-weight:400}.boulangerie h1,.boulangerie h2,.boulangerie h3{font-family:Georgia,serif;font-weight:400}.bakery{text-align:center;padding-top:35px;max-width:1100px}.bakery h1{font-size:clamp(3.2rem,6.6vw,6.2rem)}.bakery>p{margin-inline:auto}.bakery-art{position:relative;max-width:740px;margin:20px auto 30px}.bakery-art img{border-radius:50% 50% 12px 12px;max-height:380px;object-fit:cover}.stamp{position:absolute;right:-20px;bottom:10px;background:#8c4225;color:#f8ebd4;width:115px;height:115px;border-radius:50%;display:grid;place-content:center;font-size:13px;line-height:1.4;letter-spacing:.1em;transform:rotate(12deg);border:4px double #f8ebd4}.boulangerie .ticker{border:0;background:#ecd3ac;letter-spacing:.02em}.boulangerie .service-grid article{border:0;text-align:center;padding:25px;background:#f1debc;border-radius:50% 50% 0 0}.boulangerie .step{margin-block:20px}
/* 09 / Photographer: reduced chrome, wide artwork and large whitespace. */
.photographe{--paper:#faf9f5;--ink:#272c29;--accent:#272c29;--line:#d3d6cf}.photographe .demo-brand{font-size:1.2rem;letter-spacing:.08em;font-weight:400}.portfolio{padding-top:35px}.portfolio-title{display:flex;align-items:end;justify-content:space-between;gap:70px;margin-bottom:40px}.portfolio-title h1{font:400 clamp(3.3rem,5.7vw,5.7rem)/1.07 Georgia,serif;letter-spacing:-.04em;margin-bottom:0}.portfolio-title p{max-width:240px;font-size:13px;margin:0 0 5px}.portfolio figure img{max-height:620px;object-fit:cover}.portfolio figcaption{display:flex;justify-content:space-between;padding-top:10px}.photographe .ticker{text-align:left;padding-left:5%;max-width:1440px;margin:auto;letter-spacing:.1em}.photographe .service-grid{grid-template-columns:1fr;gap:0}.photographe .service-grid article{display:grid;grid-template-columns:70px 1fr 1fr;padding-block:25px;align-items:baseline;gap:25px}.photographe .step{margin:0}.photographe .service-grid h3{font-family:Georgia,serif;font-weight:400;font-size:2.1rem}.photographe .closing{background:#eeede7;color:#272c29}.photographe .closing .action{color:#faf9f5}
/* 10 / Consulting: modular grid and visible three-step method. */
.conseil{--paper:#f5f6fb;--ink:#232c65;--accent:#353db8;--line:#c2c8e3}.conseil .demo-brand{letter-spacing:.02em}.consulting h1{font-size:clamp(3.3rem,5.6vw,5.5rem);line-height:1.05}.consulting{padding-block:65px;gap:40px}.consulting figure{padding:10px;border:1px solid #c2c8e3;border-radius:8px}.method-index{display:flex;gap:20px;border-top:1px solid #c2c8e3;padding-top:20px;margin-top:35px;font-size:11px}.conseil .service-grid article{padding:30px;border:1px solid #c2c8e3;background:#fff}.conseil .step{color:#353db8;font-size:2rem;font-weight:700;margin-bottom:20px}.conseil .ticker{background:#e5e8f2;border:0}.conseil .closing{text-align:left}.conseil .closing p,.conseil .closing h2{margin-left:0}
@media(min-width:1600px){.hero{padding-top:70px;padding-bottom:90px}}
@media(max-width:800px){h1{font-size:clamp(3rem,10vw,4.8rem)}.demo-bar{flex-wrap:wrap;gap:6px 18px;padding:9px 5%;font-size:10px}.demo-bar>span{order:3;flex-basis:100%}.demo-header{padding:22px 5%;align-items:flex-start}.demo-header nav{gap:12px;flex-direction:column;font-size:11px;text-align:right}.demo-brand{font-size:1.15rem}.hero{padding:35px 5% 45px}.hero.split,.garden,.consulting,.athletic,.utility{grid-template-columns:1fr;gap:35px}.hero .lead{font-size:1rem}.hero figure{max-width:100%;min-width:0}.garage .hero figure{margin:15px 6px}.garage h1{font-size:clamp(3rem,11vw,5rem)}.dining{grid-template-columns:1fr;gap:25px}.dining-title h1{font-size:clamp(3.7rem,15vw,6.5rem)}.dining-note{padding-top:0}.dining figure{max-width:520px;margin:auto}.fashion{grid-template-columns:1fr;gap:25px}.fashion h1{font-size:clamp(3rem,11.5vw,5.7rem)}.fashion figure{margin:0 8%}.fashion-note{padding:0}.garden figure{padding-top:0}.garden h1{font-size:clamp(3.3rem,12vw,5rem)}.utility figure{grid-column:auto;grid-row:auto}.utility aside{grid-row:2}.property-title{display:block}.property-title h1{font-size:clamp(3.3rem,12vw,5rem)}.property-title .action{margin-top:8px}.property figcaption{flex-direction:column;gap:2px}.athletic h1{font-size:clamp(4rem,18vw,7.5rem);margin-left:5px}.athletic figure{max-width:480px}.vertical-word{display:none}.bakery h1{font-size:clamp(3rem,11vw,5rem)}.bakery-art{margin-inline:12px}.stamp{width:85px;height:85px;font-size:10px;right:-10px}.portfolio-title{display:block;margin-bottom:25px}.portfolio-title h1{font-size:clamp(3.2rem,11vw,5rem);margin-bottom:20px}.portfolio-title p{max-width:40ch}.consulting h1{font-size:clamp(3rem,11vw,5rem)}.method-index{gap:15px;flex-wrap:wrap}.services{padding:60px 5%}.service-grid{grid-template-columns:1fr;gap:30px}.step{margin-bottom:15px}.section-heading{margin-bottom:30px}.coiffure .service-grid article,.photographe .service-grid article{grid-template-columns:35px 1fr;gap:10px 15px}.coiffure .service-grid article p,.photographe .service-grid article p{grid-column:2}.closing{padding:60px 6%}.closing h2{font-size:clamp(2.3rem,9vw,3.5rem)}.demo-footer{flex-direction:column;align-items:flex-start;padding-block:25px}.paysagiste .closing{border-radius:55px 55px 0 0;margin-inline:0}.ticker{font-size:11px;letter-spacing:.07em}.immobilier .ticker{font-size:1.2rem}.action{font-size:12px;padding:14px 18px;gap:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
@media(max-width:800px){.athletic h1{transform:none;margin-left:0}}
@media(max-width:800px){.sport .ticker{transform:none}}
.boulangerie .service-grid p{opacity:1}
