/* DMM homepage — Brand Kit v1.2 stylesheet. Mirrors the approved Growth Scorecard LP system (styles/growth-check.css): Core Blue / Vivid Green / White / Deep Ink, Barlow display, Manrope body, mono overlines, crisp hard shadows. Scoped by .home-page on . */ @font-face{font-family:Barlow;src:url('/assets/fonts/barlow.ttf');font-weight:700;font-display:swap} @font-face{font-family:Manrope;src:url('/assets/fonts/manrope.ttf');font-weight:200 800;font-display:swap} @font-face{font-family:Mono;src:url('/assets/fonts/mono.ttf');font-display:swap} .home-page{box-sizing:border-box;margin:0} .home-page *,.home-page *::before,.home-page *::after{box-sizing:border-box} .home-page{--blue:#0067fe;--blue-strong:#0057e6;--green:#62f523;--ink:#0b0f1a;--muted:#3c4756;--rule:#a5adb8;color:var(--ink);font:16px/1.6 Manrope,Arial,sans-serif;background:#fff} .home-page a{color:inherit} .home-page button,.home-page input,.home-page select{font:inherit} .home-page button,.home-page a{-webkit-tap-highlight-color:transparent} .home-page a:focus-visible,.home-page button:focus-visible,.home-page input:focus-visible,.home-page select:focus-visible,.home-page summary:focus-visible{outline:3px solid var(--ink);outline-offset:4px;box-shadow:0 0 0 7px #fff} .home-page img{max-width:100%;height:auto;display:block} .home-page p{margin:0 0 1.2em} .home-page h1,.home-page h2,.home-page h3{font-weight:700;margin:0 0 24px;line-height:1.12} .home-page h1,.home-page .display{font-family:Barlow,'Arial Narrow',sans-serif;font-weight:700;text-transform:uppercase} .home-page h1{font-size:clamp(52px,5.4vw,82px);line-height:.96;letter-spacing:-.01em} .home-page .display{font-size:clamp(44px,5vw,70px);line-height:1;letter-spacing:0} .home-page h3{font-size:22px;letter-spacing:-.02em} .home-page em{font-style:normal;color:var(--green)} .home-page .page-container{width:min(1200px,calc(100% - 96px));margin:auto} .home-page .section{padding:100px 0} .home-page .eyebrow{font:13px/1.5 Mono,monospace;letter-spacing:1.1px;text-transform:uppercase;display:block;margin-bottom:22px} .home-page .micro{font-size:13px;line-height:1.6;margin:14px 0 0} .home-page .section-intro{max-width:620px;color:var(--muted);font-size:18px;margin-bottom:0} .home-page .hidden{display:none} .home-page .skip-link{position:absolute;left:1rem;top:-100px;z-index:20;background:#fff;color:var(--ink);padding:12px 18px} .home-page .skip-link:focus{top:1rem} /* Buttons: green + ink, hard ink shadow */ .home-page .button{display:inline-flex;gap:22px;justify-content:space-between;align-items:center;border:2px solid var(--ink);background:var(--green);color:var(--ink);padding:15px 23px;min-height:56px;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;cursor:pointer;box-shadow:6px 6px 0 var(--ink);transition:transform .18s,box-shadow .18s} .home-page .button:hover{transform:translate(2px,2px);box-shadow:4px 4px 0 var(--ink)} .home-page .button span{font:24px/1 Arial} .home-page .button-sm{min-height:46px;padding:10px 18px;box-shadow:4px 4px 0 var(--ink)} .home-page .button-sm:hover{box-shadow:2px 2px 0 var(--ink)} /* Green checkbox ticks (same as LP) */ .home-page .ticks{list-style:none;padding:0;margin:16px 0} .home-page .ticks li{position:relative;padding:3px 0 3px 30px} .home-page .ticks li::before{content:"";position:absolute;left:0;top:.45em;width:18px;height:18px;background:var(--green);border-radius:2px} .home-page .ticks li::after{content:"";position:absolute;left:6px;top:.66em;width:5px;height:9px;border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg)} /* White panel, blue hard shadow */ .home-page .panel{background:#fff;border:1px solid var(--blue);box-shadow:8px 8px 0 var(--blue)} /* Masthead + nav */ .home-page .masthead{background:var(--blue);color:#fff} .home-page .site-header{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:30px 0} .home-page .site-header .logo{width:120px} .home-page .site-nav{display:flex;align-items:center;gap:32px} .home-page .nav-links{display:flex;gap:28px;font-size:15px;font-weight:600} .home-page .nav-links a{text-decoration:none;text-underline-offset:5px} .home-page .nav-links a:hover,.home-page .nav-links a:focus-visible{text-decoration:underline} /* Hero */ .home-page .hero{padding:30px 0 100px} .home-page .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center} .home-page .hero-badge{display:flex;align-items:center;gap:10px;margin-bottom:26px} .home-page .hero-badge-star{color:var(--green);font-size:16px;line-height:1} .home-page .hero h1{margin-bottom:26px} .home-page .hero .lead{font-size:18px;line-height:1.6;max-width:560px;margin-bottom:8px} .home-page .hero .ticks{font-size:16px;margin:18px 0 34px} .home-page .hero .ticks strong{font-weight:800} .home-page .certs{display:flex;flex-wrap:wrap;align-items:center;gap:12px 14px;margin-top:34px;font:12px/1.4 Mono,monospace;letter-spacing:.6px;text-transform:uppercase} .home-page .cert{display:inline-flex;align-items:center;gap:12px} .home-page .cert-icon{width:34px;height:34px;display:grid;place-items:center;background:#fff;border:1px solid var(--ink);flex:none} .home-page .cert-icon svg,.home-page .cert-icon img{width:20px;height:20px;object-fit:contain} .home-page .cert-divider{width:1px;height:22px;background:rgba(255,255,255,.45)} /* Hero ad gallery: outlined product frame, ink hard shadow */ .home-page .gallery-frame{position:relative;height:580px;overflow:hidden;background:#fff;border:2px solid var(--ink);box-shadow:10px 10px 0 var(--ink);padding:0 16px} .home-page .hero-gallery-scroll{display:flex;flex-direction:column;gap:12px;padding-top:16px;animation:hero-gallery-scroll 22s linear infinite;will-change:transform} .home-page .hero-gallery-row{display:flex;gap:12px} .home-page .hero-gallery-card{height:140px;padding:12px;background:#fff;border:1px solid var(--rule);display:flex;align-items:center;justify-content:center;overflow:hidden} .home-page .hero-gallery-card-search{flex:3 1 0%} .home-page .hero-gallery-card-shopping{flex:1 1 0%} .home-page .hero-gallery-img{width:100%;height:100%;object-fit:contain} @keyframes hero-gallery-scroll{from{transform:translateY(0)}to{transform:translateY(-50%)}} /* Trust band (ink) */ .home-page .trust-band{background:var(--ink);color:#fff;padding:22px 0;overflow:hidden} .home-page .trust-inner{display:flex;align-items:center;gap:32px} .home-page .trust-label{flex:none;display:flex;align-items:center;gap:28px;font:13px/1.5 Mono,monospace;letter-spacing:1.1px;text-transform:uppercase} .home-page .trust-label strong{display:block;color:var(--green);font-weight:400} .home-page .trust-label::after{content:"";width:1px;height:40px;background:rgba(255,255,255,.3)} .home-page .trust-logo-carousel-wrapper{flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)} .home-page .trust-logo-carousel{display:flex;align-items:center;width:max-content;animation:trust-scroll 30s linear infinite;will-change:transform} .home-page .trust-logo-item{flex:none;display:flex;align-items:center;padding-right:48px} .home-page .trust-logo-img{height:52px;width:auto;max-width:150px;object-fit:contain;opacity:.92;filter:brightness(0) invert(1)} @keyframes trust-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}} /* Services */ .home-page .services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:48px} .home-page .service-card{padding:30px 26px 32px} .home-page .card-index{font:13px/1.5 Mono,monospace;color:var(--blue-strong);display:block;padding-bottom:16px;margin-bottom:22px;border-bottom:1px solid var(--rule)} .home-page .service-card h3{margin-bottom:12px} .home-page .service-card p{font-size:15px;color:var(--muted);margin:0} /* Scorecard promo (blue) */ .home-page .promo{background:var(--blue);color:#fff} .home-page .promo-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center} .home-page .promo .display{margin-bottom:24px} .home-page .promo .lead{font-size:18px;max-width:520px;margin-bottom:34px} .home-page .promo .micro{margin-top:24px} .home-page .showcase{position:relative;isolation:isolate;width:100%;max-width:540px;margin:0 auto;padding:10px 22% 20px} .home-page .sheet{display:block;background:#fff;border:1px solid var(--ink);box-shadow:8px 8px 0 var(--ink)} .home-page .sheet-cover{position:relative;width:100%;z-index:1} .home-page .sheet-back{position:absolute;width:44%;left:3%;top:46px;transform:rotate(-10deg);z-index:-1} .home-page .sheet-right{position:absolute;width:44%;right:3%;top:46px;transform:rotate(10deg);z-index:-1} .home-page .showcase figcaption{font:12px/1.5 Mono,monospace;letter-spacing:1px;text-align:center;margin-top:28px} /* Meet Tom */ .home-page .about-grid{display:grid;grid-template-columns:2fr 3fr;gap:36px;margin-top:48px;align-items:stretch} .home-page .profile{padding:30px;display:flex;flex-direction:column} .home-page .profile-head{display:flex;gap:18px;align-items:flex-start;margin-bottom:22px} .home-page .profile-photo{position:relative;flex:none} .home-page .profile-photo img{width:84px;height:84px;object-fit:cover;border:2px solid var(--ink)} .home-page .status-dot{position:absolute;top:-5px;right:-5px;width:16px;height:16px;background:var(--green);border:2px solid var(--ink)} .home-page .profile-name{display:flex;align-items:center;gap:8px;margin-bottom:4px} .home-page .profile-name h3{font:34px/1 Barlow,sans-serif;text-transform:uppercase;letter-spacing:0;margin:0} .home-page .profile-name svg{width:20px;height:20px;color:var(--blue)} .home-page .profile-meta{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--muted);margin-top:4px} .home-page .profile-meta svg{width:16px;height:16px;flex:none} .home-page .profile-meta.available{color:var(--ink);font-weight:700} .home-page .chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px} .home-page .chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--ink);padding:6px 10px;font:11px/1.3 Mono,monospace;letter-spacing:.5px;text-transform:uppercase} .home-page .chip svg{width:13px;height:13px;color:var(--blue)} .home-page .profile-desc{font-size:15px;color:var(--muted);flex-grow:1} .home-page .stats{display:flex;gap:40px;padding-top:18px;border-top:1px solid var(--rule)} .home-page .stat-value{font:40px/1 Barlow,sans-serif} .home-page .stat-label{font:12px/1.5 Mono,monospace;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);margin-top:6px} .home-page .testimonials{display:flex;flex-direction:column;gap:24px} .home-page .testimonial{flex:1;margin:0;padding:26px 28px;display:flex;flex-direction:column;justify-content:space-between;gap:18px} .home-page .testimonial blockquote{margin:0;font-size:16px;line-height:1.65} .home-page .testimonial figcaption{display:flex;align-items:center;justify-content:space-between;gap:16px} .home-page .testimonial figcaption img{height:40px;width:auto;max-width:180px;object-fit:contain} .home-page .stars{display:flex;gap:2px;color:var(--ink)} .home-page .stars svg{width:16px;height:16px} /* Get in touch: split panel on blue */ .home-page .contact{background:var(--blue);scroll-margin-top:0} .home-page .contact-panel{display:grid;grid-template-columns:1fr 1.1fr;background:#fff;border:2px solid var(--ink);box-shadow:10px 10px 0 var(--ink)} .home-page .contact-copy{background:var(--ink);color:#fff;padding:52px 48px} .home-page .contact-copy .eyebrow{color:var(--green);margin-bottom:18px} .home-page .contact-copy .display{margin-bottom:18px} .home-page .contact-copy>p{font-size:18px;color:rgba(255,255,255,.85);margin-bottom:0} .home-page .callback-note{border-top:1px solid rgba(255,255,255,.3);margin-top:40px;padding-top:28px} .home-page .callback-note h3{font:34px/1.05 Barlow,sans-serif;text-transform:uppercase;letter-spacing:0;margin:0 0 12px} .home-page .callback-note p{font-size:16px;color:rgba(255,255,255,.85);max-width:420px;margin:0} .home-page .contact-action{padding:48px;scroll-margin-top:24px} .home-page .contact-form{display:grid;gap:14px} .home-page .contact-form label{display:grid;gap:6px;font-size:14px;font-weight:700} .home-page .contact-form .req{color:var(--blue-strong)} .home-page .contact-form input,.home-page .contact-form select{width:100%;height:52px;border:2px solid var(--ink);border-radius:0;padding:10px 14px;background:#fff;color:var(--ink);font-weight:400} .home-page .contact-form select{-webkit-appearance:none;appearance:none;padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%230b0f1a' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center} .home-page .contact-form [data-turnstile-mount]{min-height:65px} .home-page .contact-form .button{width:100%;justify-content:center;margin-top:4px} .home-page .form-result{background:#fff;border:2px solid var(--blue);padding:14px 18px;margin:12px 0 0;font-size:14px;font-weight:700} .home-page .form-error{background:#fff;border:2px solid #c23b2e;color:#c23b2e;padding:14px 18px;margin:12px 0 0;font-size:14px;font-weight:600} /* FAQs */ .home-page .faq-wrap{max-width:860px} .home-page .faq-wrap .display{font-size:clamp(38px,4.2vw,58px)} .home-page .faq-list{margin-top:44px;border-bottom:1px solid var(--ink)} .home-page .faq-item{border-top:1px solid var(--ink)} .home-page .faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0} .home-page .faq-item summary::-webkit-details-marker{display:none} .home-page .faq-item summary::marker{content:""} .home-page .faq-item summary h3{font-size:18px;margin:0;letter-spacing:-.01em} .home-page .faq-item summary:hover h3{color:var(--blue-strong)} .home-page .faq-icon{flex:none;width:32px;height:32px;display:grid;place-items:center;border:2px solid var(--ink);font:20px/1 Mono,monospace;transition:background-color .18s} .home-page .faq-icon::before{content:"+"} .home-page .faq-item[open] .faq-icon{background:var(--green)} .home-page .faq-item[open] .faq-icon::before{content:"\2212"} .home-page .faq-answer{padding:0 52px 24px 0;max-width:65ch} .home-page .faq-answer p{color:var(--muted);margin:0 0 .7em} .home-page .faq-answer p:last-child{margin-bottom:0} .home-page .faq-answer strong{color:var(--ink)} /* Footer */ .home-page .site-footer{border-top:1px solid var(--rule)} .home-page .footer-top{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:44px 0 28px} .home-page .footer-top .logo{width:120px} .home-page .footer-cta{display:flex;align-items:center;gap:22px;flex-wrap:wrap} .home-page .footer-cta p{font-size:18px;font-weight:700;margin:0} .home-page .footer-mid{display:flex;justify-content:space-between;gap:16px 32px;flex-wrap:wrap;padding:24px 0;border-top:1px solid var(--rule)} .home-page .footer-desc{max-width:480px;margin:0;font-size:14px;color:var(--muted)} .home-page .footer-nav{display:flex;flex-wrap:wrap;gap:8px 24px;font-size:14px} .home-page .footer-nav a{color:var(--blue-strong);text-decoration:none} .home-page .footer-nav a:hover,.home-page .footer-nav a:focus-visible{text-decoration:underline} .home-page .footer-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;padding:0 0 40px;font-size:12px;color:#5c5a54} .home-page .footer-legal nav{display:flex;gap:20px} .home-page .footer-legal a{color:#5c5a54;text-decoration:underline} .home-page .footer-legal a:hover{color:var(--ink)} @media(max-width:1000px){ .home-page .page-container{width:calc(100% - 56px)} .home-page .nav-links{display:none} .home-page .hero-grid{gap:44px} .home-page .gallery-frame{height:520px} .home-page .services-grid{grid-template-columns:repeat(2,1fr)} .home-page .promo-grid{gap:40px} .home-page .about-grid{grid-template-columns:1fr} .home-page .contact-panel{grid-template-columns:1fr} .home-page .contact-copy,.home-page .contact-action{padding:40px} } @media(max-width:768px){ .home-page .hero-grid,.home-page .promo-grid{grid-template-columns:1fr} .home-page .gallery-frame{height:440px} .home-page .hero-gallery-card{height:118px;padding:8px} .home-page .showcase{max-width:460px} } @media(max-width:700px){ .home-page .page-container{width:calc(100% - 40px)} .home-page .section{padding:68px 0} .home-page .site-header{padding:22px 0} .home-page .site-header .logo{width:100px} .home-page .hero{padding:18px 0 64px} .home-page h1{font-size:clamp(44px,12vw,64px)} .home-page .display{font-size:clamp(38px,10.5vw,54px)} .home-page .eyebrow{font-size:12px;letter-spacing:.65px} .home-page .hero .lead,.home-page .promo .lead,.home-page .section-intro{font-size:17px} .home-page .button{font-size:13px} .home-page .hero .button,.home-page .promo .button{width:100%;max-width:360px} .home-page .certs{flex-direction:column;align-items:flex-start} .home-page .cert-divider{display:none} .home-page .gallery-frame{height:400px;padding:0 10px;box-shadow:7px 7px 0 var(--ink)} .home-page .hero-gallery-scroll{gap:10px;padding-top:10px} .home-page .hero-gallery-row{gap:10px} .home-page .hero-gallery-card{height:96px;padding:6px} .home-page .trust-inner{flex-direction:column;gap:16px} .home-page .trust-label{text-align:center} .home-page .trust-label::after{display:none} .home-page .trust-logo-carousel-wrapper{width:100%} .home-page .trust-logo-item{padding-right:36px} .home-page .trust-logo-img{height:44px;max-width:130px} .home-page .services-grid{grid-template-columns:1fr;gap:24px} .home-page .showcase{padding:0 20% 10px} .home-page .showcase figcaption{font-size:10px} .home-page .profile,.home-page .testimonial{padding:24px} .home-page .profile-head{gap:14px} .home-page .stats{gap:28px} .home-page .contact-panel{box-shadow:7px 7px 0 var(--ink)} .home-page .contact-copy,.home-page .contact-action{padding:28px 22px} .home-page .callback-note h3{font-size:30px} .home-page .faq-item summary h3{font-size:16px} .home-page .faq-answer{padding-right:0} .home-page .footer-top{padding:32px 0 22px} .home-page .footer-cta{gap:16px} .home-page .footer-legal{padding-bottom:32px} } @media(prefers-reduced-motion:reduce){ .home-page *,.home-page *::before,.home-page *::after{transition:none!important} .home-page .hero-gallery-scroll,.home-page .trust-logo-carousel{animation:none} }