@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600&family=Playfair+Display:ital,wght@0,400;0,500;1,400&display=swap');
:root{--ink:#181a19;--ivory:#f2eee5;--gold:#b99d74;--muted:#77746e}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',sans-serif;background:var(--ivory);color:var(--ink)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}.nav{position:absolute;z-index:9;top:0;left:0;width:100%;height:94px;display:flex;align-items:center;justify-content:space-between;padding:0 6%;color:#f7f2e9;border-bottom:1px solid #ffffff25}.brand{display:flex;gap:13px;align-items:center;font-size:19px;letter-spacing:.25em;font-weight:600;line-height:1}.brand small{display:block;font-size:8px;letter-spacing:.45em;margin-top:8px}.mark{color:var(--gold);font-size:36px;font-weight:400}.nav nav{display:flex;gap:33px;font-size:12px;letter-spacing:.05em}.nav a:hover{color:#dbc4a2}.nav-cta{border-bottom:1px solid var(--gold);padding:12px 0;font-size:12px}.menu{display:none}.hero{min-height:100vh;background:#171817;color:#f4eee6;position:relative;overflow:hidden;display:flex;align-items:center;padding:120px 6% 90px}.ambient{position:absolute;inset:0;background:radial-gradient(ellipse at 72% 45%,#7465525c,transparent 45%),radial-gradient(ellipse at 5% 100%,#343633,transparent 48%);opacity:.9}.hero-art{position:absolute;inset:16% 7% 13% 50%;overflow:hidden}.frame{position:absolute;inset:0;background:linear-gradient(115deg,#45453e 0%,#8f806d 28%,#d8c8a9 49%,#786b5b 51%,#342f2c 80%);box-shadow:0 35px 100px #0008;transform:scale(1.08);animation:heroIn 2s both}.frame:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 50%,#0002 51%);mix-blend-mode:multiply}.sphere{position:absolute;width:31%;aspect-ratio:1;border-radius:50%;top:25%;left:38%;background:radial-gradient(circle at 26% 25%,#f7e1bc,#a38a6a 35%,#292725 74%);box-shadow:25px 30px 55px #241f1f82}.seam{position:absolute;inset:0 21% 0 auto;border-left:2px solid #e9d5b55e;transform:skew(-6deg)}.frame-caption{position:absolute;bottom:20px;left:25px;font-size:10px;letter-spacing:.24em;color:#eee;z-index:3}.hero-copy{position:relative;z-index:2;width:61%;padding-top:45px}.eyebrow{font-size:11px;letter-spacing:.25em;font-weight:600;color:var(--gold)}h1,h2,h3,p{margin-top:0}.hero h1,h2,.statement h2{font-family:'Playfair Display',serif;font-weight:400;letter-spacing:-.045em}.hero h1{font-size:clamp(72px,9vw,155px);line-height:1.03;margin:30px 0 24px;text-shadow:0 8px 30px #0005}em{font-weight:400;color:var(--gold)}.lede{max-width:395px;font-size:15px;line-height:1.85;color:#d7d1c8}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:32px}.button{background:#bda17b;color:#171717;border:0;padding:19px 24px;display:inline-flex;gap:42px;justify-content:space-between;align-items:center;font-size:12px;font-weight:700;cursor:pointer;transition:background .3s,transform .3s}.button:hover{background:#d9b992;transform:translateY(-3px)}.text-link,.underlink{font-size:12px;border-bottom:1px solid currentColor;padding-bottom:7px}.scroll-note,.hero-no{position:absolute;bottom:30px;z-index:3;font-size:9px;letter-spacing:.2em;color:#d3c5b1}.scroll-note{left:6%}.scroll-note span{margin-left:12px}.hero-no{right:7%}.ticker{background:#c0a47f;color:#201f1c;overflow:hidden;padding:18px 0;font-size:11px;font-weight:700;letter-spacing:.21em;white-space:nowrap}.ticker div{width:max-content;animation:marquee 28s linear infinite}.ticker span{padding:0 44px}.section{padding:125px 8%}.intro{background:#eee9df}.intro-grid{display:grid;grid-template-columns:1.15fr .7fr;gap:12%;align-items:start}h2{font-size:clamp(47px,5.5vw,95px);line-height:1.15}.intro-grid h2{margin:25px 0}.intro-right,.contact-right{padding-top:40px}.intro-right p,.contact-right p{font-size:16px;line-height:1.9;color:#575550}.intro-right p:first-child{font-size:23px;color:#252521;line-height:1.55}.underlink{display:inline-block;margin-top:20px;font-weight:700}.services{background:#20211f;color:#eee9df}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:55px}.section-head h2{margin:0}.service{padding:35px 0;border-top:1px solid #ffffff30;display:grid;grid-template-columns:80px 1fr 32px;gap:20px;align-items:center;transition:padding .4s,background .4s}.service:last-child{border-bottom:1px solid #ffffff30}.service:hover{padding-left:20px;background:#ffffff09}.service>span{font-size:12px;color:var(--gold)}.service h3{font-family:'Playfair Display',serif;font-size:clamp(35px,4vw,60px);font-weight:400;margin:0 0 7px}.service p{font-size:13px;color:#c4bfb7;margin:0}.service b{font-size:25px;font-weight:400;color:var(--gold)}.portfolio{background:#eee9df}.muted{max-width:500px;font-size:14px;line-height:1.8;color:#68635e}.project-stage{margin-top:40px}.project-visual{height:480px;background:#272b29;display:grid;grid-template-columns:1fr 1.6fr .8fr;gap:7px;position:relative;overflow:hidden;padding:15px}.panel{background:#c1b09b;position:relative;overflow:hidden}.panel.one{background:repeating-linear-gradient(95deg,#55574f 0px,#8a887e 3px,#363a36 7px,#77776f 9px)}.panel.two{background:linear-gradient(120deg,#7d7468 15%,#d9cdb8 45%,#a99d8d 47%,#5b5a51 100%)}.panel.three{background:linear-gradient(50deg,#484641,#baa98f 50%,#676456)}.project-visual span{position:absolute;left:28px;bottom:26px;background:#171817de;padding:12px 16px;color:#eee;font-size:10px;letter-spacing:.18em}.project-meta{display:flex;justify-content:space-between;margin-top:20px;letter-spacing:.12em;font-size:11px}.project-meta a{border-bottom:1px solid;padding-bottom:5px}.live-projects{margin-top:25px}.sample{border:1px solid #ccc0af;padding:18px;display:flex;justify-content:space-between;gap:12px}.sample small{color:#79736c}.statement{text-align:center;background:#b79d7b;color:#191a19;padding:135px 20px}.statement .eyebrow,.statement em{color:#5f4635}.statement h2{font-size:clamp(66px,8vw,135px);margin:22px 0 42px}.button.light{background:#191a19;color:#eee9df}.contact{background:#e7e1d6}.contact-right form{display:grid;gap:17px;margin:30px 0}.contact label{display:grid;gap:9px;color:#333;font-size:12px;font-weight:700}.contact input,.contact select,.contact textarea{background:transparent;border:0;border-bottom:1px solid #9d9487;padding:12px 0;outline:none;border-radius:0;color:#222}.contact input:focus,.contact textarea:focus{border-color:#272321}.form-note{font-size:11px!important;line-height:1.6!important}.contact .button{width:max-content;margin-top:10px}footer{background:#191a19;color:#ede7de;padding:75px 8% 25px}.footer-brand{font-size:clamp(35px,6vw,80px);letter-spacing:-.06em;font-weight:700}.footer-brand em{font-family:'Playfair Display',serif}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid #ffffff34;padding-top:26px;margin-top:70px;font-size:11px;color:#bbb5ad}.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s ease}.reveal.visible{opacity:1;transform:none}@keyframes marquee{to{transform:translateX(-50%)}}@keyframes heroIn{from{opacity:0;transform:scale(1.2)}to{opacity:1;transform:scale(1.08)}}@media(max-width:800px){.nav{height:75px}.nav nav{display:none;position:absolute;top:75px;left:0;right:0;background:#1b1b1a;padding:20px 6%;flex-direction:column}.nav nav.open{display:flex}.nav-cta{display:none}.menu{display:block;color:white;border:0;background:transparent;font-size:26px}.hero{min-height:850px;align-items:end;padding-bottom:140px}.hero-art{inset:100px 6% 30% 20%;opacity:.72}.hero-copy{width:100%}.hero h1{font-size:clamp(64px,13vw,98px)}.hero-actions{flex-wrap:wrap}.section{padding:85px 6%}.intro-grid{grid-template-columns:1fr;gap:12px}.intro-right,.contact-right{padding-top:0}.section-head{display:block}.service{grid-template-columns:35px 1fr 24px}.project-visual{height:300px}footer{padding:65px 6% 25px}.footer-bottom{flex-direction:column;gap:14px}.scroll-note{bottom:27px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* Featured real project video: first user-uploaded footage */
.hero-video-art{inset:12% 6.5% 11% 53%;display:flex;align-items:center;justify-content:center;overflow:visible;pointer-events:none;z-index:1}
.hero-video-frame{position:relative;width:min(100%,560px);height:100%;max-height:780px;overflow:hidden;background:#2b2a27;box-shadow:0 30px 100px #0008;animation:heroIn 1.3s both}
.hero-video-frame:after{content:"";pointer-events:none;position:absolute;inset:0;background:linear-gradient(90deg,#17181726 0%,transparent 30%,#17181720 100%),linear-gradient(0deg,#17181788 0%,transparent 28%)}
.hero-video{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 50%}
.hero-video-label{position:absolute;z-index:2;bottom:27px;left:28px;right:28px;display:flex;justify-content:space-between;align-items:center;color:#f4eee6;font-size:11px;font-weight:600;letter-spacing:.2em}
.hero-video-label span{font-size:21px;color:#d5b78e}
.hero-video-art~.hero-copy{width:60%;max-width:850px}
@media(max-width:800px){.hero-video-art{inset:86px 7% 28% 18%;opacity:.88}.hero-video-frame{max-height:none}.hero-video-art~.hero-copy{width:100%}.hero-video-label{left:16px;right:16px;bottom:16px;font-size:9px}.hero-video-frame:after{background:linear-gradient(0deg,#171817a0 0%,transparent 35%),linear-gradient(90deg,#17181744,transparent)}}
@media(prefers-reduced-motion:reduce){.hero-video-frame{animation:none}}

/* Approved first video-and-logo composition, November 15 */
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.hero-approved{display:grid;grid-template-columns:39% 61%;gap:0;align-items:stretch;min-height:100vh;height:100vh;min-height:650px;padding:110px 5% 24px;background:radial-gradient(ellipse at 72% 44%,#443a35,#1a1a19 65%);overflow:hidden}
.hero-video-side{position:relative;z-index:2;min-width:0;overflow:hidden;border:1px solid #ab814b;border-radius:15px;background:#161616;box-shadow:0 30px 80px #0009}
.hero-video-side video{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.hero-video-kicker{position:absolute;left:20px;bottom:24px;z-index:2;color:#fff;background:#1119;padding:11px 13px;font-size:10px;letter-spacing:.22em}
.hero-graphic-side{position:relative;min-width:0;overflow:hidden;display:flex;align-items:center;justify-content:center}
.hero-graphic-side img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.hero-graphic-cta{position:absolute;left:25%;top:73%;width:39%;height:10%;cursor:pointer;z-index:3;border-radius:3px}
.hero-graphic-email{position:absolute;right:1%;bottom:5%;width:37%;height:9%;cursor:pointer;z-index:3}
.hero-graphic-cta:focus-visible,.hero-graphic-email:focus-visible{outline:3px solid #e3bd83;outline-offset:2px}
@media(max-width:800px){.hero-approved{height:auto;min-height:100svh;display:flex;flex-direction:column;padding:91px 5% 22px;gap:12px}.hero-video-side{height:52svh;min-height:350px;flex:none}.hero-graphic-side{width:100%;min-height:340px;aspect-ratio:1077/847}.hero-graphic-side img{object-fit:contain}.hero-graphic-cta{top:73%}}

/* Original Octopus Wall Design logo in site header */
.nav{height:105px}
.brand.brand-logo{display:block;position:relative;width:146px;height:92px;overflow:hidden;flex:none;isolation:isolate}
.brand.brand-logo img{position:absolute;display:block;width:146px;height:146px;max-width:none;top:-27px;left:0;object-fit:contain;mix-blend-mode:screen}
@media(max-width:800px){.nav{height:82px}.brand.brand-logo{width:115px;height:72px}.brand.brand-logo img{width:115px;height:115px;top:-21px}.nav nav{top:82px}}

/* Landscape official brand logo in header */
.nav .brand.brand-logo{width:240px;height:77px;flex-shrink:0}
.nav .brand.brand-logo img{position:absolute;width:240px;height:240px;max-width:none;left:0;top:-81px;object-fit:contain;mix-blend-mode:screen}
@media(max-width:800px){.nav .brand.brand-logo{width:155px;height:60px}.nav .brand.brand-logo img{width:155px;height:155px;top:-48px}}

/* Actual workmanship: editorial visual gallery */
.portfolio-real{background:#eee9df}.portfolio-real .muted{max-width:770px;margin-bottom:40px}.real-work-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}.real-work-card{margin:0;grid-column:span 4;min-width:0;position:relative;background:#272421;aspect-ratio:4/5;overflow:hidden;box-shadow:0 20px 36px #15141318}.real-work-card:nth-child(1),.real-work-card:nth-child(5){grid-column:span 6;aspect-ratio:1.18}.real-work-card:nth-child(2),.real-work-card:nth-child(4){grid-column:span 6;aspect-ratio:1.18}.real-work-card img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.75,.2,1),filter .7s;filter:saturate(.92)}.real-work-card:hover img{transform:scale(1.06);filter:saturate(1.04)}.real-work-card:after{content:"";position:absolute;inset:48% 0 0;background:linear-gradient(transparent,#090909b8);pointer-events:none}.real-work-card figcaption{position:absolute;z-index:1;bottom:22px;left:24px;right:24px;color:white;display:flex;flex-direction:column;gap:7px;text-shadow:0 2px 10px #0007}.real-work-card figcaption span{font-size:9px;letter-spacing:.22em;color:#e6c59c;font-weight:700}.real-work-card figcaption strong{font-family:"Playfair Display",serif;font-weight:400;font-size:clamp(22px,2.9vw,41px)}.real-work-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:38px}.real-work-footer>span{font-size:10px;letter-spacing:.2em;color:#767069}.portfolio-full{padding-top:90px;min-height:75vh}.portfolio-title{font-family:"Playfair Display",serif;font-size:clamp(50px,7.4vw,112px);font-weight:400;letter-spacing:-.045em;margin:22px 0}.portfolio-intro{max-width:720px;color:#514c45;font-size:16px;line-height:1.8;margin-bottom:50px}@media(max-width:800px){.real-work-grid{gap:12px}.real-work-card,.real-work-card:nth-child(1),.real-work-card:nth-child(2),.real-work-card:nth-child(4),.real-work-card:nth-child(5){grid-column:span 12;aspect-ratio:5/4}.real-work-card figcaption{left:17px;bottom:16px}.real-work-footer{flex-direction:column;align-items:flex-start}.portfolio-full{padding-top:70px}}@media(prefers-reduced-motion:reduce){.real-work-card img{transition:none}}

/* Five-image homepage gallery, user-selected order */
.portfolio-real .real-work-grid>.real-work-card:nth-child(-n+2){grid-column:span 6;aspect-ratio:1.18}
.portfolio-real .real-work-grid>.real-work-card:nth-child(n+3){grid-column:span 4;aspect-ratio:4/5}
@media(max-width:800px){.portfolio-real .real-work-grid>.real-work-card:nth-child(n){grid-column:span 12;aspect-ratio:5/4}}

/* Company introduction and wallpaper-led expertise */
.intro-expanded .intro-right p{font-size:15px;line-height:1.85}.intro-expanded .intro-right p:first-child{font-size:19px;line-height:1.65}.intro-expanded strong{color:#282723}.trust-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:60px}.trust-card{background:#e3dccf;padding:34px 30px;min-width:0;border-top:2px solid #bda17b}.trust-card>span{font-size:10px;color:#806948;letter-spacing:.15em}.trust-card h3{font:400 clamp(24px,2.6vw,37px)/1.2 "Playfair Display",serif;margin:20px 0 14px}.trust-card p{font-size:13px;color:#514e48;line-height:1.8;margin:0}.services-wallpaper .wallpaper-intro{max-width:790px;margin:30px 0 45px}.wallpaper-intro h3{font:400 clamp(35px,4vw,62px)/1.15 "Playfair Display",serif;margin:15px 0 18px}.wallpaper-intro>p:last-child{font-size:16px;color:#c9c3b9;line-height:1.9}.wallpaper-type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#655e51;border:1px solid #655e51}.wallpaper-type{background:#242522;padding:30px;min-height:230px}.wallpaper-type>span{font-size:11px;color:#c3a177;letter-spacing:.15em}.wallpaper-type h4{font:400 clamp(23px,2.4vw,36px)/1.2 "Playfair Display",serif;margin:20px 0 12px}.wallpaper-type p{font-size:13px;line-height:1.75;color:#bcb6af;margin:0}.service-partner{margin-top:55px;border-top:1px solid #ffffff50;padding:35px 0 0;display:flex;align-items:end;justify-content:space-between;gap:30px}.service-partner>div{max-width:820px}.service-partner h3{font:400 clamp(32px,3.2vw,52px)/1.2 "Playfair Display",serif;margin:15px 0}.service-partner p:last-child{color:#c4bfb7;font-size:14px;line-height:1.85}.service-partner .underlink{white-space:nowrap}@media(max-width:800px){.trust-grid{grid-template-columns:1fr;margin-top:35px}.trust-card{padding:26px}.wallpaper-type-grid{grid-template-columns:1fr 1fr}.wallpaper-type{padding:22px;min-height:215px}.service-partner{display:block}.service-partner .underlink{margin-top:20px;display:inline-block}}@media(max-width:500px){.wallpaper-type-grid{grid-template-columns:1fr}.wallpaper-type{min-height:0;padding:25px}}

/* Vinyl Project video beside our introductory story */
.intro-video-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);align-items:center;gap:clamp(26px,6vw,110px);margin:65px 0 12px}.intro-video-frame{position:relative;height:clamp(360px,43vw,610px);min-width:0;overflow:hidden;background:#22211f;box-shadow:0 28px 65px #1815112a}.intro-video-frame video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.intro-video-frame:after{content:"";pointer-events:none;position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#10100d8c)}.intro-video-label{position:absolute;z-index:1;bottom:25px;left:26px;color:#f4eee5;font-size:12px;font-weight:700;letter-spacing:.18em}.intro-video-label span{color:#e3c79f;font-size:10px}.intro-video-copy h3{font:400 clamp(38px,4.8vw,75px)/1.09 "Playfair Display",serif;letter-spacing:-.045em;margin:18px 0 28px}.intro-video-copy p:not(.eyebrow){font-size:16px;color:#55504b;line-height:1.85;max-width:470px}@media(max-width:800px){.intro-video-feature{grid-template-columns:1fr;gap:22px;margin:45px 0 10px}.intro-video-frame{height:clamp(390px,105vw,650px)}.intro-video-copy h3{font-size:clamp(38px,10vw,60px)}}

/* Original gold octopus replaces ticker star separators */
.ticker .ticker-octopus{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;padding:0 25px}.ticker .ticker-octopus img{width:33px;height:33px;object-fit:contain;display:block;max-width:none}@media(max-width:800px){.ticker .ticker-octopus{padding:0 17px}.ticker .ticker-octopus img{width:27px;height:27px}}

/* Company details and contact in bottom footer */
.company-footer .footer-tagline{color:#bfb2a1;letter-spacing:.07em;font-size:13px;margin:12px 0 52px}.footer-columns{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:45px;border-top:1px solid #ffffff29;padding-top:36px}.footer-columns h3{font:600 11px/1.5 "DM Sans",sans-serif;letter-spacing:.2em;color:#d1af80;margin:0 0 19px}.footer-columns p,.footer-columns a{display:block;font-size:13px;color:#e1d8ca;line-height:1.8;margin:0 0 11px;overflow-wrap:anywhere}.footer-columns a:hover{color:#d1af80}.company-footer .footer-bottom{margin-top:65px}@media(max-width:800px){.footer-columns{grid-template-columns:1fr;gap:23px}.company-footer .footer-tagline{margin-bottom:35px}.company-footer .footer-bottom{margin-top:48px}}