:root { --ink:#141414; --muted:#65615d; --paper:#f7f3ed; --line:#ded8d0; --gold:#d59b27; --yellow:#fedc30; --cyan:#11b6df; --pink:#e52294; --serif:'Playfair Display', Georgia, serif; --sans:'DM Sans', Arial, sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); overflow-x:hidden; }
body:has(.menu-toggle[aria-expanded="true"]) { overflow:hidden; }
.page-grain { position:fixed; z-index:20; inset:0; pointer-events:none; opacity:.04; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E"); }
.section-shell { width:min(1190px, calc(100% - 72px)); margin:0 auto; }
.topbar { min-height:37px; display:flex; justify-content:space-between; align-items:center; padding:8px max(36px, calc((100vw - 1190px)/2)); background:var(--ink); color:#efede9; font-size:10px; letter-spacing:.09em; text-transform:uppercase; }
.topbar p { margin:0; }.topbar p span { color:var(--yellow); margin:0 8px; }.topbar a { color:#fff; text-decoration:none; font-weight:700; }
.site-header { width:min(1190px, calc(100% - 72px)); height:88px; margin:auto; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:10; }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); }.brand-mark { display:block; flex:0 0 40px; width:40px; height:40px; overflow:hidden; border:2px solid var(--gold); border-radius:50%; background:#151515; box-shadow:inset 0 0 0 2px #fff; }.brand-mark img { display:block; width:100%; height:100%; object-fit:cover; transform:scale(1.08); }.brand-name { display:flex; align-items:baseline; gap:6px; font-family:var(--serif); font-size:18px; line-height:1; letter-spacing:-.025em; font-weight:700; white-space:nowrap; }.brand-name b { font:inherit; }
.nav-links { display:flex; align-items:center; gap:31px; }.nav-links > a:not(.nav-cta) { color:var(--ink); text-decoration:none; font-size:13px; font-weight:600; transition:color .2s; }.nav-links > a:not(.nav-cta):hover { color:var(--pink); }.nav-cta { padding:11px 16px; color:#fff; background:var(--ink); text-decoration:none; border-radius:2px; font-size:12px; font-weight:700; }.nav-cta span { color:var(--yellow); font-size:16px; margin-left:5px; }.menu-toggle { display:none; }
.hero { display:grid; grid-template-columns:1.02fr .98fr; min-height:586px; align-items:center; padding:40px 0 67px; gap:48px; }.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 21px; font-size:10px; letter-spacing:.19em; font-weight:700; }.eyebrow span { display:block; width:25px; height:2px; background:var(--pink); }.hero h1,.section-heading h2,.statement h2,.contact-copy h2 { margin:0; font-family:var(--serif); font-size:clamp(47px, 5.1vw, 75px); line-height:.99; letter-spacing:-.055em; font-weight:700; }.hero h1 em,.section-heading h2 em,.statement h2 em,.contact-copy h2 em { color:var(--gold); font-weight:600; }.hero-text { max-width:440px; color:var(--muted); margin:25px 0 27px; line-height:1.65; font-size:15px; }.hero-actions { display:flex; align-items:center; gap:29px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:17px; min-height:48px; padding:0 20px; text-decoration:none; border:0; font-family:inherit; cursor:pointer; transition:transform .2s, box-shadow .2s; }.button:hover { transform:translateY(-3px); box-shadow:0 10px 20px rgba(17,17,17,.15); }.button-primary { background:var(--ink); color:#fff; font-size:12px; font-weight:700; }.button-primary span { color:var(--yellow); font-size:17px; }.text-link { color:var(--ink); text-decoration:none; font-size:12px; font-weight:700; border-bottom:1px solid var(--ink); padding-bottom:4px; }.text-link span { margin-left:8px; color:var(--pink); }.hero-trust { display:flex; align-items:center; gap:11px; margin-top:43px; }.hero-trust p { font-size:11px; line-height:1.5; color:var(--muted); margin:0; }.hero-trust strong { color:var(--ink); }.stacked-avatars { display:flex; padding-left:4px; }.stacked-avatars i { display:block; width:27px; height:27px; border:2px solid var(--paper); border-radius:50%; margin-left:-7px; background:linear-gradient(135deg, var(--cyan), #164a78); }.stacked-avatars i:nth-child(2){background:linear-gradient(135deg,#fedc30,#e52294)}.stacked-avatars i:nth-child(3){background:linear-gradient(135deg,#efb049,#633018)}
.hero-art { height:465px; position:relative; isolation:isolate; }.hero-art::before { content:""; position:absolute; inset:48px 38px 30px 18px; background:#191919; border-radius:3px 84px 3px 3px; z-index:-3; transform:rotate(-3deg); }.sun-orbit { width:280px; height:280px; position:absolute; top:39px; left:114px; border:11px solid var(--gold); border-right-color:transparent; border-bottom-color:transparent; border-radius:50%; transform:rotate(4deg); z-index:-1; opacity:.95; }.paper { position:absolute; border-radius:2px; box-shadow:0 20px 22px rgba(0,0,0,.26); }.paper-back { width:240px; height:288px; background:#f5cf39; top:79px; right:86px; transform:rotate(13deg); }.paper-mid { width:251px; height:310px; background:#ec3099; top:105px; right:125px; transform:rotate(-9deg); }.logo-frame { position:absolute; width:291px; height:331px; top:64px; left:88px; box-shadow:0 28px 27px rgba(0,0,0,.38); transform:rotate(-2.5deg); overflow:hidden; border:7px solid #e4a828; background:#151515; }.logo-frame::after { content:""; position:absolute; inset:0; background:linear-gradient(130deg,rgba(255,255,255,.17), transparent 28%); pointer-events:none; }.logo-frame img { width:100%; height:100%; object-fit:cover; }.color-chip { width:27px; height:27px; position:absolute; z-index:3; box-shadow:5px 6px 0 rgba(0,0,0,.35); }.chip-cyan { background:var(--cyan); right:80px; top:55px; }.chip-pink { background:var(--pink); right:51px; top:83px; }.chip-yellow { background:var(--yellow); right:80px; top:111px; }.paper-label { position:absolute; padding:12px 15px; color:#222; background:#f4f0e9; bottom:30px; left:12px; font-size:9px; letter-spacing:.1em; line-height:1.35; transform:rotate(-4deg); box-shadow:0 10px 13px rgba(0,0,0,.2); }.paper-label b { font-size:11px; }.quality-seal { display:grid; place-content:center; width:90px; height:90px; position:absolute; right:20px; bottom:31px; border:1px solid #eee; outline:4px solid var(--ink); border-radius:50%; background:var(--ink); color:#fff; text-align:center; font-size:9px; letter-spacing:.12em; line-height:1.4; transform:rotate(13deg); }.quality-seal b { color:var(--yellow); font-size:12px; }
.marquee { overflow:hidden; background:var(--yellow); border-block:1px solid var(--ink); padding:12px 0; }.marquee-track { white-space:nowrap; display:flex; width:max-content; align-items:center; gap:24px; animation:scroll 26s linear infinite; font-weight:700; font-size:14px; letter-spacing:.14em; }.marquee i { color:var(--pink); font-size:18px; font-style:normal; } @keyframes scroll { to { transform:translateX(-50%); } }
.section-pad { padding:122px 0; }.section-heading { display:grid; grid-template-columns:.9fr 1.1fr; margin-bottom:47px; }.section-heading > .eyebrow { padding-top:11px; }.section-heading h2 { font-size:clamp(38px,4vw,57px); }.section-heading h2 + p { max-width:360px; margin:18px 0 0; color:var(--muted); font-size:14px; line-height:1.6; }.services-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }.service-card { display:block; min-height:394px; position:relative; border:1px solid var(--line); background:#fcfaf6; overflow:hidden; color:var(--ink); text-decoration:none; transition:transform .25s, box-shadow .25s; }.service-card:hover { transform:translateY(-7px); box-shadow:0 16px 26px rgba(30,21,9,.12); }.service-card:focus-visible { outline:3px solid var(--pink); outline-offset:3px; }.card-number { position:absolute; z-index:2; top:13px; right:14px; font-size:10px; font-weight:700; }.service-visual { height:237px; position:relative; overflow:hidden; }.card-content { padding:15px 17px 17px; }.card-content p { margin:0 0 6px; color:var(--pink); letter-spacing:.13em; font-weight:700; font-size:9px; }.card-content h3 { margin:0 0 8px; font-family:var(--serif); font-size:22px; letter-spacing:-.04em; }.card-content > span { color:var(--muted); font-size:10px; line-height:1.45; display:flex; justify-content:space-between; gap:5px; }.card-content b { color:var(--ink); font-size:15px; }.brand-visual { display:grid; place-items:center; background:#111; color:#fff; font-family:var(--serif); font-size:28px; line-height:.86; letter-spacing:-.07em; text-align:center; }.brand-visual span { z-index:1; }.brand-visual i { position:absolute; width:120px; height:120px; border:1px solid var(--gold); border-radius:50%; }.brand-visual i:nth-of-type(1){width:190px;height:190px;border-color:var(--pink);transform:translate(-60px,-42px)}.brand-visual i:nth-of-type(2){transform:translate(92px,80px);border-color:var(--cyan)}.brand-visual i:nth-of-type(3){width:300px;height:300px;border-color:#ffdf29;transform:translate(-60px,60px)}
.wedding-visual { background:#e8ded3; padding:30px; color:#745a50; font-family:var(--serif); font-size:30px; font-style:italic; line-height:.8; }.wedding-visual::before { content:""; width:180px; height:215px; position:absolute; top:20px; left:35px; background:#f9f4ec; transform:rotate(8deg); box-shadow:6px 6px 0 #c9b9aa; }.wedding-visual span,.floral { position:relative; z-index:1; }.floral { font-size:70px; position:absolute; right:23px; bottom:14px; color:#a56a74; transform:rotate(32deg); }.package-visual { background:#f0c526; display:grid; place-items:center; font-family:var(--serif); font-size:34px; font-weight:700; line-height:.78; letter-spacing:-.07em; color:#111; }.package-visual::before { content:""; position:absolute; width:180px; height:160px; border:2px solid #111; transform:rotate(-13deg); }.package-visual span { position:relative; z-index:1; }.mini-box { width:70px; height:70px; position:absolute; background:var(--pink); right:16px; bottom:16px; transform:rotate(12deg); box-shadow:8px 8px 0 #0eaeda; }.retail-visual { background:var(--cyan); padding:26px; color:#f9f5ee; font-size:42px; font-weight:700; letter-spacing:-.08em; line-height:.78; }.retail-visual::before { content:""; position:absolute; width:159px; height:159px; border-radius:50%; background:var(--pink); right:-57px; top:-45px; }.retail-visual span { position:relative; }.stripe { height:33px; width:120%; position:absolute; background:var(--yellow); bottom:42px; left:-10px; transform:rotate(-13deg); border-block:2px solid #111; }
.statement-wrap { background:#151515; color:#f7f3ed; padding:114px 0 104px; position:relative; overflow:hidden; }.statement-wrap::after { content:"SP"; color:transparent; -webkit-text-stroke:1px #4b4239; position:absolute; right:-30px; bottom:-114px; font:800 260px/1 var(--serif); letter-spacing:-.1em; }.statement { position:relative; z-index:1; }.eyebrow.light span { background:var(--yellow); }.statement h2 { max-width:720px; color:#fff; }.statement-grid { display:grid; grid-template-columns:1.7fr 1fr 1fr; gap:30px; padding-top:50px; margin-top:46px; border-top:1px solid #4c4741; }.statement-grid > p { max-width:350px; margin:0; color:#c8c2ba; line-height:1.65; font-size:14px; }.stat { border-left:2px solid var(--pink); padding-left:18px; }.stat:nth-child(3){border-color:var(--cyan)}.stat strong { display:block; margin-bottom:6px; color:#fff; font-family:var(--serif); font-size:25px; letter-spacing:-.04em; }.stat span { color:#c8c2ba; font-size:12px; line-height:1.5; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }.step { position:relative; padding:30px 40px 4px 0; min-height:225px; border-right:1px solid var(--line); }.step:not(:first-child) { padding-left:39px; }.step:last-child { border:0; }.step > span { color:var(--gold); font-size:11px; font-weight:700; }.step-icon { position:absolute; top:25px; right:33px; display:grid; place-content:center; width:32px; height:32px; border-radius:50%; background:var(--ink); color:var(--yellow); }.step:not(:first-child) .step-icon { right:0; }.step h3 { margin:35px 0 8px; font-family:var(--serif); font-size:25px; letter-spacing:-.04em; }.step p { max-width:258px; color:var(--muted); font-size:12px; line-height:1.6; }
.contact-section { background:#e8dfd3; padding:110px 0; }.contact-inner { display:grid; grid-template-columns:1fr .92fr; gap:91px; }.contact-copy h2 { font-size:clamp(47px, 5vw, 67px); }.contact-copy > p:not(.eyebrow) { max-width:350px; color:var(--muted); font-size:14px; line-height:1.65; margin:22px 0 31px; }.contact-details { border-top:1px solid #c6bcb0; max-width:420px; }.contact-details a,.contact-details p { display:block; position:relative; padding:14px 32px 14px 0; margin:0; border-bottom:1px solid #c6bcb0; color:var(--ink); text-decoration:none; font:600 13px/1.5 var(--sans); }.contact-details small { display:block; margin-bottom:2px; color:var(--muted); font-size:8px; letter-spacing:.17em; font-weight:700; }.contact-details a span { position:absolute; right:0; top:25px; color:var(--pink); font-size:18px; }.quote-form { padding:28px 29px; background:#f9f6f0; box-shadow:14px 14px 0 #c7b394; }.form-title { display:flex; justify-content:space-between; align-items:center; margin-bottom:17px; }.form-title p { margin:0; font-size:10px; font-weight:700; letter-spacing:.17em; }.form-title span { color:var(--pink); }.quote-form label { display:block; margin:12px 0 0; color:#3f3a35; font-size:10px; font-weight:700; }.quote-form input,.quote-form select,.quote-form textarea { width:100%; margin-top:6px; padding:10px 0; outline:0; border:0; border-bottom:1px solid #cfc8bf; background:transparent; font:12px var(--sans); color:var(--ink); resize:vertical; }.quote-form select { cursor:pointer; }.quote-form .button { width:100%; margin-top:22px; }.footer { min-height:108px; display:flex; gap:25px; align-items:center; justify-content:space-between; }.footer p,.back-top { color:var(--muted); font-size:10px; text-decoration:none; }.back-top { font-weight:700; color:var(--ink); letter-spacing:.1em; }
.whatsapp-float { position:fixed; z-index:12; display:flex; align-items:center; gap:8px; bottom:22px; right:23px; padding:12px 16px; color:#fff; background:#26a65b; border-radius:30px; box-shadow:0 6px 17px #0003; text-decoration:none; font-size:12px; font-weight:700; transition:transform .2s; }.whatsapp-float:hover { transform:translateY(-3px); }.whatsapp-float:first-letter { font-size:16px; }
.service-page { min-height:calc(100vh - 125px); display:grid; place-items:center; padding:80px 0; background:linear-gradient(135deg, #f7f3ed 0%, #eee5d9 100%); }.service-placeholder { position:relative; max-width:785px; padding:58px 58px 52px; background:#fcfaf6; border:1px solid var(--line); box-shadow:16px 16px 0 #d5c7b4; text-align:center; overflow:hidden; }.service-placeholder::before { content:""; position:absolute; width:240px; height:240px; left:-132px; top:-145px; border:30px solid var(--yellow); border-radius:50%; opacity:.85; }.service-placeholder::after { content:"✦"; position:absolute; right:27px; top:25px; color:var(--pink); font-size:34px; }.service-placeholder h1 { position:relative; margin:0; font:700 clamp(43px,6vw,74px)/.99 var(--serif); letter-spacing:-.055em; }.service-placeholder h1 em { color:var(--gold); font-weight:600; }.service-placeholder > p { position:relative; max-width:490px; margin:24px auto 30px; color:var(--muted); line-height:1.65; font-size:15px; }.placeholder-note { position:relative; margin:0 auto 28px; padding:14px 18px; max-width:515px; border:1px dashed #bbac9b; background:#f4eee6; color:#564c42; font-size:12px; line-height:1.55; }.placeholder-note strong { color:var(--ink); }.placeholder-actions { position:relative; display:flex; justify-content:center; gap:15px; flex-wrap:wrap; }.placeholder-actions .button { min-width:172px; }.button-secondary { border:1px solid var(--ink); background:transparent; color:var(--ink); font-size:12px; font-weight:700; }
.reveal { opacity:0; transform:translateY(20px); transition:opacity .65s ease, transform .65s ease; }.reveal.visible { opacity:1; transform:none; }.delay-1 { transition-delay:.12s; }.delay-2 { transition-delay:.24s; }.delay-3 { transition-delay:.36s; }
@media (max-width: 820px) { .section-shell,.site-header { width:min(100% - 40px, 590px); }.topbar { padding:8px 20px; }.topbar p { font-size:8px; }.topbar a { font-size:9px; }.site-header { height:74px; }.menu-toggle { display:flex; width:40px; height:40px; border:0; background:transparent; align-items:center; justify-content:center; flex-direction:column; gap:5px; cursor:pointer; }.menu-toggle span { display:block; width:21px; height:2px; background:var(--ink); transition:transform .2s; }.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.nav-links { display:none; position:absolute; top:68px; left:0; right:0; padding:23px; flex-direction:column; align-items:flex-start; gap:21px; background:#f7f3ed; border:1px solid var(--line); box-shadow:0 15px 25px #0002; }.nav-links.open { display:flex; }.nav-cta { width:100%; text-align:center; }.hero { grid-template-columns:1fr; padding:55px 0 43px; gap:25px; }.hero-copy { order:2; }.hero h1 { font-size:clamp(44px, 13vw, 69px); }.hero-art { order:1; height:360px; max-width:450px; width:100%; margin:auto; }.hero-art::before{inset:36px 12px 20px 12px}.sun-orbit{width:218px;height:218px;left:calc(50% - 80px);top:28px}.logo-frame{width:226px;height:264px;left:calc(50% - 127px);top:48px}.paper-back{width:184px;height:237px;right:calc(50% - 159px);top:65px}.paper-mid{width:191px;height:248px;right:calc(50% - 128px);top:87px}.color-chip{transform:scale(.8);right:calc(50% - 165px)}.chip-cyan{top:40px}.chip-pink{top:64px;right:calc(50% - 185px)}.chip-yellow{top:88px}.paper-label{bottom:12px;left:2px}.quality-seal{width:75px;height:75px;right:4px;bottom:15px}.section-pad { padding:79px 0; }.section-heading { display:block; margin-bottom:32px; }.section-heading > .eyebrow { padding-top:0; }.services-grid { grid-template-columns:repeat(2,1fr); gap:12px; }.service-card { min-height:351px; }.service-visual { height:202px; }.card-content { padding:13px; }.card-content h3 { font-size:19px; }.statement-wrap { padding:76px 0; }.statement-grid { grid-template-columns:1fr 1fr; gap:27px 20px; padding-top:30px; margin-top:31px; }.statement-grid > p { grid-column:1 / -1; }.steps { display:block; }.step,.step:not(:first-child) { padding:25px 45px 25px 0; min-height:auto; border-bottom:1px solid var(--line); border-right:0; }.step:not(:first-child) { padding-left:0; }.step:not(:first-child) .step-icon,.step-icon{ right:3px; top:28px; }.step h3 { margin:17px 0 8px; }.contact-section { padding:75px 0; }.contact-inner { display:block; }.quote-form { margin-top:48px; padding:24px 21px; }.footer { padding:28px 0; flex-wrap:wrap; }.footer p { order:3; width:100%; margin:0; }.whatsapp-float { right:15px; bottom:15px; }.whatsapp-float span{display:none;} }
@media (max-width: 450px) { .topbar p span,.topbar a { display:none; }.topbar { justify-content:center; }.hero-actions { gap:17px; flex-wrap:wrap; }.hero-trust { margin-top:31px; }.services-grid { grid-template-columns:1fr; }.service-card { min-height:352px; }.service-visual { height:205px; }.statement-grid { grid-template-columns:1fr; }.footer .brand { width:100%; }.back-top { margin-left:auto; }.footer p{line-height:1.5;} }
@media (max-width: 520px) { .brand-mark { flex-basis:36px; width:36px; height:36px; }.brand-name { gap:5px; font-size:16px; }.service-page { padding:46px 0; }.service-placeholder { padding:48px 22px 31px; box-shadow:9px 9px 0 #d5c7b4; }.service-placeholder > p { font-size:14px; }.placeholder-actions { display:grid; }.placeholder-actions .button { width:100%; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.01ms !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } .reveal { opacity:1; transform:none; } }