

:root{--paper:#f7f4ef;--ink:#151313;--red:#a80e2d;--red2:#d20a2e;--line:#dcd5cc;--muted:#736b65}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif}.nav{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 8vw;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(247,244,239,.92);backdrop-filter:blur(16px);z-index:20}.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;font-family:"Playfair Display",serif;font-size:19px}.brand img{width:30px;height:30px;object-fit:cover;border-radius:50%}.brand small{font:500 8px "DM Sans";letter-spacing:3px;margin-left:5px;color:var(--muted)}nav{display:flex;align-items:center;gap:34px}nav>a{color:inherit;text-decoration:none;text-transform:uppercase;font-size:10px;letter-spacing:2px}.button{display:inline-block;background:var(--red);color:white!important;text-decoration:none;text-transform:uppercase;letter-spacing:2px;font-size:10px;padding:17px 24px;border:1px solid var(--red);transition:.25s}.button:hover{background:#7d0921;transform:translateY(-2px)}.button.small{padding:13px 18px}.menu{display:none;border:0;background:none;text-transform:uppercase;letter-spacing:2px}.hero{min-height:760px;padding:110px 8vw 80px;position:relative;overflow:hidden}.eyebrow,.section-label{font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--red);font-weight:600}.hero h1,.manifesto h2,.work h2,.pricing h2,.contact h2{font-family:"Playfair Display",serif;font-weight:500;letter-spacing:-2px}.hero h1{font-size:clamp(58px,8vw,116px);line-height:.88;margin:25px 0 32px;max-width:900px}.hero h1 em,.pricing h2 em,.contact h2 em{color:var(--red);font-weight:500}.lede{max-width:590px;font-size:16px;line-height:1.8;color:#554e49}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:38px}.text-link{color:var(--ink);font-size:11px;text-transform:uppercase;letter-spacing:2px;text-decoration:none}.hero-art{position:absolute;right:5vw;top:95px;width:38vw;height:570px;pointer-events:none;opacity:.95}.hero-art .red-panel{position:absolute;right:0;top:40px;width:72%;height:72%;background:var(--red)}.hero-art img{position:absolute;width:90%;right:4%;top:50px;mix-blend-mode:multiply}.stamp{position:absolute;right:2%;bottom:22px;border:1px solid var(--ink);border-radius:50%;width:95px;height:95px;display:grid;place-items:center;text-align:center;font-size:8px;line-height:1.6;letter-spacing:2px;transform:rotate(10deg)}.manifesto,.work,.pricing{padding:110px 8vw;border-top:1px solid var(--line)}.manifesto-grid,.work-heading,.pricing-intro{display:grid;grid-template-columns:1.35fr .65fr;gap:80px;align-items:end}.manifesto h2,.work h2,.pricing h2{font-size:clamp(42px,5vw,72px);line-height:1.02;margin:25px 0}.manifesto-grid>p,.work-heading>p,.pricing-intro>p{color:var(--muted);line-height:1.7;font-size:13px;max-width:420px}.pillars{display:grid;grid-template-columns:repeat(3,1fr);margin-top:80px;border-top:1px solid var(--line)}.pillars article{padding:35px 38px 15px 0;border-right:1px solid var(--line)}.pillars article+article{padding-left:38px}.pillars span,.price-grid>article>span{font:600 9px "DM Sans";letter-spacing:2px;color:var(--red)}.pillars h3{font:500 27px "Playfair Display";margin:18px 0 12px}.pillars p{font-size:12px;line-height:1.7;color:var(--muted)}.work{background:#fbfaf7}.work-heading{margin-bottom:55px}.projects{display:grid;grid-template-columns:1fr 1.25fr;gap:48px 22px}.project.wide{grid-column:1/-1}.mock{height:360px;position:relative;overflow:hidden;padding:28px;display:flex;justify-content:space-between;align-items:flex-end;color:white;background:#222}.mock:before,.mock:after{content:"";position:absolute;border-radius:50%;filter:blur(1px)}.mock-one{background:linear-gradient(135deg,#151515,#5a0a19)}.mock-one:before{width:270px;height:270px;background:#b81232;right:8%;top:10%}.mock-two{background:linear-gradient(140deg,#eee7dd 0 50%,#94122b 50%)}.mock-two:before{width:230px;height:230px;background:#171717;right:12%;top:16%}.mock-three{background:linear-gradient(110deg,#171717 0 42%,#9e102d 42%)}.mock-three:before{width:360px;height:360px;border:1px solid rgba(255,255,255,.5);right:10%;top:-20%}.mock>span,.mock>div{position:relative;z-index:2}.mock b{font:500 42px "Playfair Display";display:block}.mock small{letter-spacing:3px;font-size:8px}.project-meta{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:17px 0}.project-meta h3{font:500 21px "Playfair Display";margin:0}.project-meta span{font-size:8px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}.pricing-intro{margin-bottom:55px}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line)}.price-grid article{padding:42px;min-height:420px;border-right:1px solid var(--line)}.price-grid article:last-child{border-right:0}.price-grid .featured{background:var(--red);color:white;transform:translateY(-12px)}.featured>span{color:#fff!important}.price-grid h3{font:500 35px "Playfair Display";margin:20px 0 8px}.price{font-size:13px;letter-spacing:1px;margin-bottom:35px}.price-grid p,.price-grid li{font-size:12px;line-height:1.7}.price-grid ul{padding:20px 0 0;list-style:none;border-top:1px solid currentColor;opacity:.85}.price-grid li{margin:9px 0}.contact{background:#151313;color:white;padding:110px 8vw 38px}.section-label.light{color:#e9627e}.contact h2{font-size:clamp(48px,7vw,92px);line-height:.95;max-width:900px;margin:25px 0}.contact>p{color:#c8c0bb;max-width:520px;line-height:1.7;margin-bottom:35px}.button.inverse{background:white;color:var(--ink)!important;border-color:white}.footer-line{border-top:1px solid #3b3633;margin-top:100px;padding-top:25px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;color:#918984}
@media(max-width:850px){.nav{padding:0 5vw}.nav nav{display:none}.menu{display:block}.hero{padding:80px 6vw 60px;min-height:auto}.hero-art{position:relative;right:auto;top:auto;width:100%;height:420px;margin-top:60px}.hero h1{font-size:62px}.manifesto,.work,.pricing,.contact{padding:80px 6vw}.manifesto-grid,.work-heading,.pricing-intro{grid-template-columns:1fr;gap:10px}.pillars,.price-grid{grid-template-columns:1fr}.pillars article,.pillars article+article,.price-grid article{border-right:0;border-bottom:1px solid var(--line);padding:28px 0}.price-grid .featured{transform:none;padding:32px}.projects{grid-template-columns:1fr}.project.wide{grid-column:auto}.mock{height:300px}.footer-line{gap:20px;flex-direction:column}.brand small{display:none}}


/* --- Motion system --- */
@keyframes heroRise{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
@keyframes artReveal{from{opacity:0;transform:translateX(70px) scale(.96)}to{opacity:.95;transform:none}}
@keyframes lineGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes floatMark{0%,100%{translate:0 0}50%{translate:0 -10px}}

.hero .eyebrow,.hero h1,.hero .lede,.hero-actions{opacity:0}
.loaded .hero .eyebrow{animation:heroRise .75s .08s cubic-bezier(.2,.75,.2,1) forwards}
.loaded .hero h1{animation:heroRise 1s .16s cubic-bezier(.2,.75,.2,1) forwards}
.loaded .hero .lede{animation:heroRise .85s .33s cubic-bezier(.2,.75,.2,1) forwards}
.loaded .hero-actions{animation:heroRise .85s .46s cubic-bezier(.2,.75,.2,1) forwards}
.hero-art{opacity:0}
.loaded .hero-art{animation:artReveal 1.25s .22s cubic-bezier(.16,.8,.2,1) forwards}
.hero-art img{transition:filter .4s ease;will-change:transform;animation:floatMark 6s 1.6s ease-in-out infinite}
.hero-art:hover img{filter:saturate(1.12) contrast(1.04)}

.reveal{opacity:0;transform:translateY(36px);transition:opacity .8s cubic-bezier(.2,.75,.2,1) var(--delay,0ms),transform .8s cubic-bezier(.2,.75,.2,1) var(--delay,0ms)}
.reveal.visible{opacity:1;transform:none}

.project{transition:transform .35s ease}
.project:hover{transform:translateY(-5px)}
.mock{transition:transform .25s ease,filter .35s ease;transform-style:preserve-3d;will-change:transform}
.project:hover .mock{filter:contrast(1.04) saturate(1.08)}
.mock:after{transition:transform .8s cubic-bezier(.2,.75,.2,1)}
.project:hover .mock:after{transform:scale(1.08) translateX(-3%)}

.nav{transition:box-shadow .3s ease}
.nav a:not(.button){position:relative}
.nav nav>a:not(.button):after{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:1px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .3s ease}
.nav nav>a:not(.button):hover:after{transform:scaleX(1);transform-origin:left}

.button{will-change:transform;transition:background .25s ease,transform .2s ease,box-shadow .25s ease}
.button:hover{box-shadow:0 12px 28px rgba(125,9,33,.18)}
.text-link{transition:color .25s ease,letter-spacing .25s ease}
.text-link:hover{color:var(--red);letter-spacing:2.5px}

.price-grid article{transition:transform .35s ease,box-shadow .35s ease}
.price-grid article:hover{transform:translateY(-8px);box-shadow:0 22px 50px rgba(20,15,12,.08)}
.price-grid .featured:hover{transform:translateY(-20px)}

.scroll-progress{position:fixed;left:0;top:0;height:2px;width:100%;background:var(--red2);transform:scaleX(0);transform-origin:left;z-index:100;pointer-events:none}
.cursor-glow{position:fixed;left:-120px;top:-120px;width:240px;height:240px;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(210,10,46,.07),transparent 68%);margin:-120px 0 0 -120px}
main,.nav{position:relative;z-index:1}

@media(max-width:850px){
  .cursor-glow{display:none}
  .price-grid .featured:hover{transform:translateY(-8px)}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  .reveal,.hero .eyebrow,.hero h1,.hero .lede,.hero-actions,.hero-art{opacity:1!important;transform:none!important}
  .cursor-glow{display:none}
}

/* Design versatility section */
.style-spectrum{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:58px}
.style-card{border:1px solid var(--line);padding:18px;transition:transform .35s ease,box-shadow .35s ease;background:#fbfaf7}
.style-card>span{font-size:8px;letter-spacing:2.5px;color:var(--red);font-weight:600}
.style-visual{height:260px;margin:16px 0 24px;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;position:relative}
.style-visual b{position:relative;z-index:2;font:500 48px "Playfair Display";letter-spacing:-2px}
.style-visual small{position:relative;z-index:2;font-size:7px;letter-spacing:2.5px;margin-top:5px}
.fine .style-visual{background:radial-gradient(circle at 70% 25%,#7a1125 0 12%,transparent 13%),linear-gradient(145deg,#0e0e0e,#292323);color:#f5eee6}
.fine .style-visual:after{content:"";position:absolute;width:160px;height:160px;border:1px solid #b18d68;border-radius:50%;right:25px;top:25px}
.modern .style-visual{background:linear-gradient(135deg,#e9e3da 0 58%,#151313 58%);color:#a80e2d}
.modern .style-visual:after{content:"";position:absolute;width:120px;height:120px;background:#a80e2d;right:30px;top:28px}
.urban .style-visual{background:#a80e2d;color:white;transform:rotate(.5deg)}
.urban .style-visual:after{content:"ROSES";position:absolute;right:-22px;top:20px;font:600 70px "DM Sans";color:#151313;transform:rotate(90deg);opacity:.85}
.style-card h3{font:500 27px "Playfair Display";margin:0 0 10px}
.style-card p{font-size:11px;line-height:1.75;color:var(--muted);margin-bottom:8px}
.style-card:hover{transform:translateY(-8px);box-shadow:0 22px 50px rgba(20,15,12,.08)}
.spectrum-line{display:flex;align-items:center;gap:18px;margin-top:45px;font-size:8px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.spectrum-line i{height:1px;background:var(--line);flex:1}
.spectrum-line strong{color:var(--ink);font-weight:500;text-align:center}
@media(max-width:850px){.style-spectrum{grid-template-columns:1fr}.style-visual{height:220px}.spectrum-line i{display:none}.spectrum-line{justify-content:space-between;gap:10px}.spectrum-line strong{font-size:7px}}
