/* Pure Studio — noir, anthracite, cuivre et orange. */
:root{--paper:#111112;--ink:#faf6f1;--muted:#c2bdb8;--blue:#ff985b;--accent:#ff8b42;--accent-soft:#ffb17b;--accent-wash:#ff853b16;--sky:#272426;--mint:#211f1f;--peach:#30231e;--line:#ffffff24;--ember:#ff712b;--copper:#a84d2c;--raised:#292729}
html body{background:#111112;color:var(--ink)}
html ::selection{background:#ff8b42;color:#20140e}
html em,html #marche h2 em,html .trust-heading h2 em{color:#ff985b}
html .kicker,html .trust-heading .kicker,html .trust-index{color:#ffb17b}
html .header{background:linear-gradient(110deg,#171719,#1f1c1a);box-shadow:0 12px 32px #0002;position:relative;z-index:20}
html .brand-logo i{color:#ff985b}
html .brand-logo svg circle{fill:#ff853b}
html .brand-logo svg rect{fill:#35302c}
html .nav-contact{background:linear-gradient(125deg,#38302a,#272322);border:1px solid #ff9b6240;box-shadow:inset 0 1px 0 #ffffff0c,0 5px 16px #0003}
html .services-dropdown,html .services-menu>div{background:#242223;border-color:#ff9b6230}
html .button.blue{background:linear-gradient(135deg,#ffab58,#ff742c);color:#26160e;border:1px solid #ffba7c;box-shadow:0 3px 0 #9b421f,0 12px 28px #e3692429,inset 0 1px 0 #ffffff65;font-weight:600}
html .button.blue:hover{background:linear-gradient(135deg,#ffbb74,#ff8a3c);box-shadow:0 4px 0 #9b421f,0 16px 32px #e3692438}
html .button.white,html .button.outline{background:#292628;color:#ffb17b;border-color:#ff9b6240}
html .text-link .arrow,html .hero-link,html .nav-contact .arrow{color:#ffab72}
html .page-progress{background:linear-gradient(90deg,#b64b26,#ff853b,#ffd0a3)}
html .silver-hero.cinema-hero.reel-hero{background:radial-gradient(ellipse at 84% 42%,#75432e 0%,#3b2b25 26%,#191819 55%,#111112 82%)}
html .cinema-hero.reel-hero:after{background:linear-gradient(90deg,#111112 0%,#111112fa 36%,#111112b3 46%,transparent 61%),linear-gradient(0deg,#111112 0%,transparent 17%,transparent 88%,#1111125c 100%)}
html .cinema-hero .silver-copy>p{color:#d3cdc8}
html .cinema-hero h1 em{color:#ff9b60;background:linear-gradient(100deg,#ffc194,#ff823a);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
html .silver-copy h1 em .title-word{background-image:linear-gradient(110deg,#ffab6f,#ff9950 45%,#ff742c)}
html .hero-reel{background:radial-gradient(ellipse at 55% 45%,#ff853b24,transparent 72%)}
html .reel-card{background:#292526;border:1px solid #e5c7b34d;box-shadow:0 15px 26px #0008,0 3px 6px #0005,inset 0 1px 0 #ffe9d52b}
html .reel-browser{background:linear-gradient(110deg,#43372f,#2d2929)}
html .reel-browser>i{background:#ff9c60}
html .reel-browser>i:nth-child(2){background:#bf7650}
html .reel-browser>i:nth-child(3){background:#7e5946}
html .reel-browser>span,html .reel-name{color:#e3d7ce}
html .reel-name{background:#272323}
html .service-shortcuts>a{background:linear-gradient(145deg,#302b28,#211f20);border:1px solid #ddaa7b24;box-shadow:0 10px 24px #0004,inset 0 1px 0 #ffffff09}
html .service-shortcuts>a:hover{background:linear-gradient(145deg,#443027,#292222)}
html .service-shortcuts>a span{color:#ff9c60}
html .clear-web,html .clear-card,html .service-pair>article,html .starting-points>a,html .guide-grid>a{background:linear-gradient(145deg,#2d2928,#201f20);border:1px solid #ffffff16;box-shadow:0 14px 30px #0003,inset 0 1px 0 #ffffff08}
html .clear-scope,html .clear-card .clear-scope,html .service-direct-goal,html .website-preview figcaption>span{color:#ffc49d}
html .clear-web li:before,html .clear-card li:before{background:#ff8b42}
html .studio-position{background:linear-gradient(120deg,#242224,#2e2723)}
html .studio-position .position-columns p,html .principles p{color:#ccc5c0}
html .principles article>span{color:#ffa56b}
html .local-trust{background:#19191a}
html .trust-grid article{background:linear-gradient(145deg,#302c2a,#252324);border:1px solid #ffffff14;box-shadow:0 12px 25px #0003,inset 0 1px 0 #ffffff0a}
html .trust-grid .trust-host{background:linear-gradient(145deg,#4b3023,#2d2522);border-color:#ff9b6233}
html .trust-pin{stroke:#ff9b60}
html .host-name{color:#ffe2cb}
html .trust-grid p,html .trust-heading>p,html .trust-grid li{color:#d1c7c0}
html .trust-grid a,html .trust-grid li:before{color:#ffb47f}
html .trust-place,html .trust-footnote{color:#bcb1aa}
html #marche{background:linear-gradient(130deg,#262324,#342922)}
html #marche .stats>div{background:linear-gradient(145deg,#3c3430,#292627);border:1px solid #ffb17b21;box-shadow:0 12px 25px #0003,inset 0 1px 0 #ffffff0b}
html #marche .stats strong{color:#ffb17b}
html #marche .stats p{color:#e0d6ce}
html #marche .source{color:#bdb1a8}
html .contact-band{background:radial-gradient(ellipse at 80% 50%,#663a24,transparent 75%),#35251f}
html .contact-band h2{color:#fff2e8}
html .contact-band p{color:#dec5b5}
html .balanced-footer{background:#161617}
html .footer-services>b,html .footer-studio>b{color:#ffac75}
html .footer-coordinates>a,html .footer-services a,html .footer-studio a{color:#d0c8c2}
html .compact-footer-bottom{color:#aaa19b}
@media(max-width:760px){html .cinema-hero.reel-hero:after{background:linear-gradient(0deg,#111112 0%,transparent 10%,transparent 28%,#111112 44%)}html .silver-hero.cinema-hero.reel-hero{background:radial-gradient(ellipse at 65% 88%,#75432e 0%,#33251f 25%,#111112 53%)}html .button.blue{box-shadow:0 3px 0 #9b421f,0 10px 22px #e3692424}}
@media print{html body{background:white;color:black}}

/* Three clear entry points, with comfortable spacing and a shared baseline. */
html .starting-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
html .starting-points>a.starting-card{position:relative;display:flex;flex-direction:column;min-width:0;padding:30px;border:1px solid #ffffff19;border-radius:16px;background:#202022;box-shadow:0 14px 34px #0003,inset 0 1px 0 #ffffff08;text-decoration:none;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
html .starting-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:27px}
html .starting-icon{display:grid;place-items:center;width:48px;height:48px;border:1px solid #ff985b30;background:#ff985b0b;border-radius:13px;color:#ff985b}
html .starting-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
html .starting-number{font:500 13px/1 var(--title);letter-spacing:.08em;color:#858080}
html .starting-points>a>.starting-label{display:block;font:500 10px/1.6 var(--body);text-transform:uppercase;letter-spacing:.08em;color:#c8b7ab;min-height:32px;margin:0 0 12px;overflow-wrap:break-word}
html .starting-points>a>h3{font-size:clamp(24px,2.2vw,30px);font-weight:500;line-height:1.18;letter-spacing:-.035em;margin:0 0 18px;color:#faf6f1}
html .starting-points>a>p{font-size:14px;line-height:1.8;color:#bfb9b5;margin:0 0 32px}
html .starting-points>a>.starting-cta{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:20px;border-top:1px solid #ffffff12;font-size:12px;line-height:1.5;font-weight:500;color:#f2e9e3}
html .starting-cta>span{display:grid;place-items:center;flex:none;width:30px;height:30px;background:#ff985b12;border-radius:50%;color:#ffab75}
html .starting-cta .arrow{width:17px;height:17px}
@media(hover:hover){html .starting-points>a.starting-card:hover{transform:translateY(-5px);border-color:#ff985b70;box-shadow:0 20px 42px #0005}html .starting-card:hover .starting-cta>span{background:#ff985b;color:#21160e}}
html .starting-card:focus-visible{outline:2px solid #ff985b;outline-offset:5px}
html .stats .stat-label{font-size:11px;font-weight:500;line-height:1.5;letter-spacing:.07em;text-transform:uppercase;color:#d6b49e}
html #marche{background:#1a1a1c}
html #marche .stats>div{background:#242426;border-color:#ffffff12;box-shadow:0 8px 24px #0002}
/* A quiet, solid contact band; the orange call to action provides the contrast. */
html .contact-band{background:#202022;padding:36px 0}
html .contact-band h2{color:#faf6f1}
html .contact-band p{color:#bfb9b5}
html .contact-band .button.blue{background:#ff8b42;border-color:#ffab72;box-shadow:0 5px 16px #0003;color:#24150c}
html .contact-band .button.blue:hover{background:#ffa15f}
@media(min-width:901px) and (max-width:1100px){html .starting-points>a.starting-card{padding:25px}}
@media(max-width:900px){html .starting-points{grid-template-columns:1fr;gap:18px}html .starting-points>a.starting-card{padding:27px 30px}html .starting-card-top{margin-bottom:22px}html .starting-points>a>.starting-label{min-height:0;margin-bottom:10px}html .starting-points>a>p{max-width:55ch;margin-bottom:24px}html .starting-points>a>h3{font-size:28px}}
@media(max-width:500px){html .starting-points>a.starting-card{padding:25px;border-radius:14px}html .starting-points>a>h3{font-size:26px}html .starting-points>a>p{font-size:13px}html .starting-points>a>.starting-cta{font-size:12px}html .starting-icon{width:43px;height:43px}html #marche .stat-label{font-size:8px;letter-spacing:.025em}html #marche .stats>div{padding:18px 10px}html .contact-band{padding:30px 0}}
@media(prefers-reduced-motion:reduce){html .starting-points>a.starting-card{transition:none}html .starting-points>a.starting-card:hover{transform:none}}

/* A staggered project journey; its illuminated spine follows the reading. */
html .journey-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:45px}
html .journey-heading>p{font-size:14px;line-height:1.8;color:#bcb6b1;max-width:320px;margin:0 0 5px}
html .journey{position:relative;isolation:isolate;--journey-progress:100%;margin:0 0 38px;padding:15px 0}
html .journey-rail{position:absolute;z-index:-1;left:50%;top:40px;bottom:65px;width:2px;background:#ffffff12;transform:translateX(-50%)}
html .journey-rail>i{position:absolute;inset:0 0 auto;height:var(--journey-progress);background:linear-gradient(#ffb57e,#ff7d35);box-shadow:0 0 15px #ff8b4270}
html .journey-rail>b{position:absolute;left:50%;top:var(--journey-progress);width:8px;height:8px;border-radius:50%;background:#fff0d8;box-shadow:0 0 10px #ff8b42,0 0 26px #ff8b42;transform:translate(-50%,-50%)}
html .journey-step{position:relative;width:50%;padding-right:43px;margin:0}
html .journey-step:nth-of-type(even){margin-left:50%;padding:0 0 0 43px}
html .journey-step+.journey-step{margin-top:-70px}
html .journey-node{position:absolute;right:0;top:27px;transform:translateX(50%);display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#211c19;color:#ffb17b;border:1px solid #ff9b6255;font:500 13px/1 var(--body);box-shadow:0 0 0 8px #111112;transition:background .3s,box-shadow .3s}
html .journey-step:nth-of-type(even) .journey-node{left:0;right:auto;transform:translateX(-50%)}
html .journey-step:before{content:'';position:absolute;right:20px;top:48px;width:23px;height:1px;background:#ff985b50}
html .journey-step:nth-of-type(even):before{left:20px;right:auto}
html .journey-card{position:relative;overflow:hidden;padding:29px 30px 24px;background:#202022;border:1px solid #ffffff17;border-radius:17px;box-shadow:0 15px 30px #0003,inset 0 1px 0 #ffffff09;transition:border-color .4s,box-shadow .4s,transform .4s}
html .journey-watermark{position:absolute;right:17px;top:6px;font:600 105px/1 var(--title);letter-spacing:-.07em;color:transparent;-webkit-text-stroke:1px #ffffff09;pointer-events:none}
html .journey-card-head{display:flex;align-items:center;gap:12px;margin-bottom:23px;color:#ffad77}
html .journey-card-head svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
html .journey-card-head>span{font-size:10px;letter-spacing:.12em}
html .journey-card h3{position:relative;font-size:27px;line-height:1.2;margin:0 0 15px;max-width:280px;color:#f7f1ec}
html .journey-card p{font-size:13px;line-height:1.8;color:#beb8b2;margin:0;max-width:42ch}
html .journey-result{display:flex;align-items:center;gap:10px;font-size:11px;line-height:1.5;color:#e9c8b0;margin-top:22px;padding-top:16px;border-top:1px solid #ffffff0c}
html .journey-result>span{font-size:20px;color:#ff985b}
html .journey-step.is-current .journey-card{border-color:#ff985b75;box-shadow:0 15px 38px #0005,0 0 30px #ff8b420c}
html .journey-step.is-passed .journey-node,html .journey-step.is-current .journey-node{background:#ff8b42;color:#21160f;border-color:#ffc197;box-shadow:0 0 0 8px #111112,0 0 25px #ff8b4238}
@media(hover:hover){html .journey-card:hover{transform:translateY(-4px);border-color:#ff985b75}}
/* Real published pages, with readable captions and direct links. */
html .actual-websites{min-width:0;width:100%;margin:0}
html .work-capture{display:block;overflow:hidden;border:1px solid #ffffff24;border-radius:10px;background:#171718;box-shadow:0 16px 28px #0004;transition:transform .3s,border-color .3s}
html .work-window{display:flex;align-items:center;gap:4px;height:25px;padding:0 10px;background:#303033}
html .work-window>i{width:4px;height:4px;background:#aaa09a;border-radius:50%}
html .work-window>span{font-size:8px;letter-spacing:.04em;color:#bdb9b4;flex:1;text-align:center;padding-right:18px}
html .work-capture img{width:100%;height:auto;aspect-ratio:1100/620;object-fit:cover;display:block}
html .work-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px;font-size:11px;color:#eee5df}
html .work-caption>span{color:#ff985b;font-size:17px}
html .work-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
html .work-pair .work-window{height:20px}.work-pair .work-window>span{font-size:6px}
html .work-pair .work-caption{font-size:9px;padding:9px 10px}
html .actual-websites figcaption{text-align:left;font-size:11px;color:#bfb3ab;margin-top:18px;line-height:1.7}
@media(hover:hover){html .work-capture:hover{transform:translateY(-4px);border-color:#ff985b88}}
@media(max-width:1000px){html .contact-band>.container{display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center}html .contact-band p{margin-left:auto;margin-right:auto}html .contact-band .button{margin:0;align-self:center}html .journey-card{padding:25px}html .journey-card h3{font-size:24px}html .journey-step{padding-right:32px}html .journey-step:nth-of-type(even){padding-left:32px}html .journey-step+.journey-step{margin-top:-40px}html .journey-step:before{width:12px}}
@media(max-width:650px){html .journey-heading{display:block;margin-bottom:28px}html .journey-heading>p{margin-top:20px;font-size:13px}html .journey{padding:0 0 8px;margin-bottom:26px}html .journey-rail{left:18px;top:29px;bottom:45px}html .journey-step,html .journey-step:nth-of-type(even){width:100%;margin:0;padding:0 0 0 53px}html .journey-step+.journey-step{margin-top:24px}html .journey-node,html .journey-step:nth-of-type(even) .journey-node{left:18px;right:auto;top:25px;transform:translateX(-50%);width:34px;height:34px;font-size:11px;box-shadow:0 0 0 5px #111112}html .journey-step:before,html .journey-step:nth-of-type(even):before{left:35px;right:auto;top:42px;width:18px}html .journey-card{padding:23px 20px 20px;border-radius:13px}html .journey-card h3{font-size:23px}html .journey-card p{font-size:12px;line-height:1.8}html .journey-card-head{gap:9px;margin-bottom:20px}html .journey-card-head>span{font-size:9px}html .journey-watermark{font-size:88px;top:13px;right:10px}html .journey-result{font-size:10px;gap:8px;margin-top:19px}html .journey-step.is-passed .journey-node,html .journey-step.is-current .journey-node{box-shadow:0 0 0 5px #111112,0 0 20px #ff8b4238}html .work-pair{gap:10px;margin-top:12px}html .work-pair .work-caption{font-size:8px;padding:8px}html .work-pair .work-window>span{display:none}}
@media(prefers-reduced-motion:reduce){html .journey-card,html .journey-node,html .work-capture{transition:none}html .journey-card:hover,html .work-capture:hover{transform:none}html .journey-rail>b{display:none}}

/* Replace abstract market percentages with the questions a client needs answered. */
html .customer-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
html .customer-card{display:flex;flex-direction:column;padding:28px;background:#242426;border:1px solid #ffffff13;border-radius:14px;min-width:0;box-shadow:0 12px 28px #0002}
html .customer-card>svg{width:32px;height:32px;fill:none;stroke:#ff985b;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;margin-bottom:22px}
html .customer-card h3{font-size:25px;line-height:1.2;color:#f6f1ec;margin:0 0 20px}
html .customer-card p{font-size:13px;line-height:1.8;color:#bfb9b3;margin:0}
html .customer-card .customer-question{font-size:16px;line-height:1.5;color:#f0c3a2;min-height:72px;margin-bottom:12px}
html .customer-action{margin-top:24px;padding-top:20px;border-top:1px solid #ffffff12}
html .customer-action>span{display:block;color:#ffab77;font-size:9px;line-height:1.6;letter-spacing:.08em;margin-bottom:9px}
html .customer-card>a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:25px;margin-top:auto;font-size:11px;color:#f7eee6}
html .customer-card>a .arrow{width:18px;flex:none}
html .data-sheet>.kicker{margin-bottom:25px}
/* A compact service header, three real projects, then concrete deliverables. */
html .clear-web.web-showcase{display:block;padding:32px;background:#201f20;border-radius:16px}
html .web-showcase .clear-web-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 30px;align-items:start;margin-bottom:30px}
html .web-showcase .clear-card-top{grid-column:1/-1;margin-bottom:22px}
html .web-showcase .clear-web-copy>h3{grid-column:1;font-size:30px;margin:0 0 12px}
html .web-showcase .clear-web-goal{grid-column:1;font-size:14px;line-height:1.8;margin:0 0 12px;max-width:53ch}
html .web-showcase .clear-scope{grid-column:1;font-size:10px;margin:0;line-height:1.8}
html .web-showcase .clear-web-copy>.button{grid-column:2;grid-row:2/5;align-self:center;margin:0;font-size:11px;padding:15px 18px}
html .web-showcase .actual-websites{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}
html .web-showcase .work-pair{display:contents}
html .web-showcase .work-window{height:25px}
html .web-showcase .work-window>span{font-size:7px}
html .web-showcase .work-caption{font-size:10px;padding:12px}
html .web-showcase .actual-websites figcaption{grid-column:1/-1;margin:0;font-size:11px}
html .web-inclusions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:30px}
html .web-inclusions h4{font-size:13px;line-height:1.5;font-weight:500;color:#f7e8dc;margin:0 0 9px}
html .web-inclusions p{font-size:12px;line-height:1.8;color:#bfb9b3;margin:0}
@media(max-width:900px){html .customer-path{gap:13px}html .customer-card{padding:22px 18px}html .customer-card h3{font-size:22px}html .customer-card .customer-question{font-size:14px}html .web-showcase .clear-web-copy{grid-template-columns:1fr}html .web-showcase .clear-web-copy>.button{grid-column:1;grid-row:auto;justify-self:start;margin-top:20px}html .web-showcase .actual-websites{gap:12px}html .web-showcase .work-caption{font-size:9px;padding:9px}html .web-inclusions{gap:18px}}
@media(max-width:650px){html .customer-path{grid-template-columns:1fr;gap:16px}html .customer-card{padding:25px}html .customer-card .customer-question{min-height:0;font-size:16px;margin-bottom:14px}html .customer-card h3{font-size:25px;margin-bottom:15px}html .customer-card>svg{margin-bottom:17px}html .clear-web.web-showcase{padding:23px}html .web-showcase .clear-web-copy>h3{font-size:26px}html .web-showcase .actual-websites{grid-template-columns:1fr}html .web-showcase .work-caption{font-size:11px;padding:12px}html .web-showcase .work-window>span{display:block}html .web-inclusions{grid-template-columns:1fr;gap:21px;margin-top:26px}html .web-inclusions>div{padding-left:15px;border-left:2px solid #ff985b60}html .web-inclusions h4{font-size:14px;margin-bottom:5px}}