*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px}
body{-webkit-font-smoothing:antialiased;font-family:'Geist',sans-serif;color:#202020;background:#fff}
h1,h2,h3,h4,h5,h6,p,ul,ol{margin:0;padding:0}
h1{font-size:inherit;font-weight:inherit;line-height:inherit}
h2{font-size:inherit;font-weight:inherit;line-height:inherit}
h3{font-size:inherit;font-weight:inherit;line-height:inherit}
h4{font-size:inherit;font-weight:inherit;line-height:inherit}
button{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}
input,textarea{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}
a{color:inherit;text-decoration:none}

/* Font families */
.instrument-serif-regular-italic {
  font-family: "Instrument Serif", serif;
  font-style: italic;
  font-weight: 400;
  line-height: normal;
  align-self: stretch;
}

.instrument-serif-regular {
  font-family: "Instrument Serif", serif;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  align-self: stretch;
}

.ditos-root{background:#fff;min-height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;font-family:'Geist',sans-serif;overflow-x:hidden}

/* Animations */
.animate-on-scroll{opacity:0;transform:translateY(20px);transition:opacity 0.6s ease,transform 0.6s ease}
.animate-on-scroll.visible{opacity:1;transform:translateY(0)}

/* Pill / Tag */
.pill{border:1px solid #0671bb;color:#0671bb;border-radius:100px;padding:7px 37px;font-size:16px;display:inline-block;background:transparent}
.pill-white{background:#fff}

/* Section heading */
.section-heading-main{color:#202020;font-size:40px;font-weight:500}
.section-heading-sub{color:#6a6b6f;font-size:50px;font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;line-height:normal;align-self:stretch;margin-top:4px}
@media(max-width:768px){.section-heading-main{font-size:32px}.section-heading-sub{font-size:40px}}

/* Hero */
.hero{position:relative;width:100%;overflow:hidden;display:flex;flex-direction:column;align-items:center;padding-top:32px;height:987px;flex-shrink:0}
.hero::before{content:'';position:absolute;inset:0;background:#0671BB;opacity:0.85;z-index:1;pointer-events:none}
.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(6, 113, 187, 0.30) 0%, rgba(0, 20, 40, 0.85) 100%);z-index:2;pointer-events:none}
@media(max-width:1024px){.hero{height:600px}}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;will-change:transform}
.hero-inner{position:relative;z-index:10;width:100%;max-width:1341px;margin:0 auto;padding:0 16px;display:flex;flex-direction:column;align-items:center;height:100%}

/* Header */
.header{width:100%;display:flex;align-items:center;justify-content:space-between;margin-bottom:60px}
@media(max-width:768px){.header{margin-bottom:40px}}
.logo{height:57px;object-fit:contain}
@media(max-width:768px){.logo{height:40px}}
.nav-pills{display:none;background:#fff;border-radius:9999px;padding:8px;gap:8px;align-items:center;box-shadow:0 1px 3px rgba(0,0,0,0.08)}
@media(min-width:1024px){.nav-pills{display:flex}}
.hamburger{display:none;background:none;border:none;cursor:pointer;padding:4px;z-index:60}
@media(max-width:1023px){.hamburger{display:flex;align-items:center;justify-content:center}}
@media(min-width:1024px){.hamburger{display:none}}
.header-contact-btn{display:none}
@media(min-width:1024px){.header-contact-btn{display:inline-block}}
.nav-btn{padding:8px 20px;font-size:14px;border-radius:9999px;border:none;cursor:pointer;background:transparent;color:#000;white-space:nowrap;font-family:'Geist',sans-serif;transition:background 0.2s,color 0.2s}
.nav-btn:hover{background:#f3f4f6}
.nav-btn.nav-active{background:#0671bb;color:#fff;font-weight:600;box-shadow:0 4px 6px rgba(0,0,0,0.1)}
.btn-white{background:#fff;color:#000;font-weight:500;padding:12px 32px;border-radius:34px;font-size:14px;border:none;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,0.08);font-family:'Geist',sans-serif;transition:background 0.2s}
.btn-white:hover{background:#f3f4f6}
.btn-blue{background:#0671bb;color:#fff;font-weight:500;padding:12px 32px;border-radius:34px;font-size:14px;border:none;cursor:pointer;box-shadow:0 4px 6px rgba(0,0,0,0.1);font-family:'Geist',sans-serif;transition:background 0.2s}
.btn-blue:hover{background:#055c99}

/* Mobile Nav */
.mobile-nav{position:fixed;inset:0;z-index:999;background:rgba(6,113,187,0.97);backdrop-filter:blur(8px);flex-direction:column;padding:24px;opacity:0;visibility:hidden;transform:translateX(100%);transition:opacity 0.35s ease,transform 0.35s ease,visibility 0s 0.35s}
.mobile-nav.open{opacity:1;visibility:visible;transform:translateX(0);transition:opacity 0.35s ease,transform 0.35s ease,visibility 0s 0s}
.mobile-nav-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:48px}
.mobile-nav-header .logo{height:45px;object-fit:contain}
.mobile-nav-close{background:none;border:none;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center}
.mobile-nav-links{display:flex;flex-direction:column;gap:8px;flex:1}
.mobile-nav-btn{background:none;border:none;cursor:pointer;color:#fff;font-family:'Geist',sans-serif;font-size:24px;font-weight:500;text-align:left;padding:16px 0;border-bottom:1px solid rgba(255,255,255,0.15);opacity:0;transform:translateX(30px);transition:opacity 0.3s ease,transform 0.3s ease}
.mobile-nav.open .mobile-nav-btn{opacity:1;transform:translateX(0)}
.mobile-nav.open .mobile-nav-btn:nth-child(1){transition-delay:0.1s}
.mobile-nav.open .mobile-nav-btn:nth-child(2){transition-delay:0.15s}
.mobile-nav.open .mobile-nav-btn:nth-child(3){transition-delay:0.2s}
.mobile-nav.open .mobile-nav-btn:nth-child(4){transition-delay:0.25s}
.mobile-nav-btn:hover{opacity:0.8}
.mobile-contact-btn{width:100%;padding:14px 32px;font-size:16px;margin-top:32px;background:#fff;color:#0671bb;opacity:0;transform:translateY(20px);transition:opacity 0.3s ease 0.3s,transform 0.3s ease 0.3s}
.mobile-nav.open .mobile-contact-btn{opacity:1;transform:translateY(0)}

/* Hero copy */
.hero-copy{display:flex;flex-direction:column;align-items:center;text-align:center;color:#fff;gap:24px;max-width:940px;margin:0 auto 40px}
.hero-badge{background:rgba(255,255,255,0.2);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.3);border-radius:9999px;padding:8px 24px;font-size:16px;box-shadow:0 1px 3px rgba(0,0,0,0.08)}
@media(max-width:768px){.hero-badge{font-size:14px}}
.hero-h1{font-size:62px;font-weight:700;line-height:1.1;display:flex;flex-direction:column;align-items:center}
.hero-h1 .italic-line{font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;line-height:normal;align-self:stretch}
@media(max-width:1024px){.hero-h1{font-size:48px}}
@media(max-width:768px){.hero-h1{font-size:36px}}
.hero-sub{font-size:20px;opacity:0.9;max-width:700px;line-height:1.6}
@media(max-width:768px){.hero-sub{font-size:16px}}
.hero-note{font-size:16px;opacity:0.8;margin-top:8px}
@media(max-width:768px){.hero-note{font-size:14px}}

/* Dashboard card */
.dashboard-wrap{position:relative;width:100%;max-width:1256px;height:406px;border-radius:20px;overflow:hidden;backdrop-filter:blur(13px);background:rgba(255,255,255,0.4);margin-top:auto;flex-shrink:0;box-shadow:0 20px 50px rgba(0,0,0,0.15);border:1px solid rgba(255,255,255,0.2);will-change:transform}
@media(max-width:768px){.dashboard-wrap{height:300px;border-radius:16px 16px 0 0}}
.dashboard-inner{position:absolute;width:95%;top:36px;left:30px}
@media(max-width:1024px){.dashboard-inner{left:50%;transform:translateX(-50%);top:16px}}
.dashboard-inner img{width:100%;height:auto;object-fit:cover;object-position:top;box-shadow:0 25px 50px rgba(0,0,0,0.15);border-radius:16px 16px 0 0}

/* Cards grid */
.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;width:100%}
@media(max-width:1024px){.cards-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.cards-grid{grid-template-columns:1fr;gap:20px}}
.card{background:#f5f5f5;border-radius:20px;padding:35px;display:flex;flex-direction:column;gap:22px;align-items:flex-start;width:100%;height:100%;transition:background 0.2s}
.card:hover{background:#efefef}
@media(max-width:768px){.card{padding:25px}}
.card-emoji{font-size:52px;line-height:1}
.card-body{display:flex;flex-direction:column;gap:17px;width:100%}
.card-title{font-size:20px;font-weight:600;color:#202020}
.card-desc{color:#858489;font-size:16px;font-weight:500;line-height:1.6}
.card-wide{grid-column:span 2}
@media(max-width:768px){.card-wide{grid-column:span 1}}

/* Section containers */
.section{width:100%;max-width:1338px;margin:0 auto;padding:120px 16px}
@media(max-width:768px){.section{padding:80px 16px}}
.section-gray{width:100%;background:#f5f5f5;padding:120px 16px}
@media(max-width:768px){.section-gray{padding:80px 16px}}
.section-gray-inner{max-width:1338px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:46px}

.section-header{display:flex;flex-direction:column;gap:48px}
.section-header-row{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;width:100%}
@media(max-width:768px){.section-header-row{flex-direction:column;align-items:flex-start;gap:24px}}
.section-header-left{display:flex;flex-direction:column;align-items:flex-start;max-width:560px;gap:16px}
.section-desc{color:#858489;font-size:16px;font-weight:500;max-width:491px;line-height:1.6}

/* List items */
.list-item{display:flex;align-items:flex-start;gap:10px;text-align:left}
.list-item svg{flex-shrink:0;margin-top:2px}
.list-item span{color:#202020;font-size:16px;font-weight:500;line-height:1.4;padding-top:2px}

/* Target audience */
.audience-grid{display:flex;gap:30px;width:100%}
@media(max-width:1024px){.audience-grid{flex-direction:column;gap:20px}}
.audience-card{flex:1;border-radius:20px;padding:30px;display:flex;flex-direction:column;gap:30px;transition:box-shadow 0.2s}
.audience-card:hover{box-shadow:0 4px 12px rgba(0,0,0,0.08)}
@media(max-width:768px){.audience-card{padding:20px}}
.audience-white{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,0.04)}
.audience-blue{background:linear-gradient(to bottom,#0065b4,rgba(255,255,255,0.9))}
.audience-title{font-size:32px;font-family:"Instrument Serif",serif;font-style:normal;font-weight:400;line-height:normal;align-self:stretch}
@media(max-width:768px){.audience-title{font-size:28px}}
.audience-desc{font-size:16px;font-weight:500;line-height:1.6}
.audience-list{background:#f5f5f5;border-radius:20px;padding:34px;display:flex;flex-direction:column;gap:15px;margin-top:auto;height:100%;justify-content:center}
@media(max-width:768px){.audience-list{padding:20px}}

/* Steps */
.steps-grid{background:rgba(255,255,255,0.05);backdrop-filter:blur(4px);border-radius:20px;width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:10px}
@media(max-width:768px){.steps-grid{grid-template-columns:1fr}}
.step-card{background:linear-gradient(to bottom,#0065b4,#339fea);border-radius:20px;padding:29px;display:flex;flex-direction:column;gap:15px;color:#fff;overflow:hidden;height:100%;box-shadow:0 4px 6px rgba(0,0,0,0.1);transition:box-shadow 0.2s}
.step-card:hover{box-shadow:0 10px 25px rgba(0,0,0,0.2)}
@media(max-width:768px){.step-card{padding:25px}}
.step-num{background:#fff;color:#0671bb;border-radius:50%;width:73px;height:73px;display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:700;flex-shrink:0;box-shadow:0 1px 3px rgba(0,0,0,0.08)}
.step-title{font-size:32px;font-family:"Instrument Serif",serif;font-style:normal;font-weight:400;line-height:normal;align-self:stretch;margin-top:10px}
@media(max-width:768px){.step-title{font-size:28px}}
.step-desc{font-size:16px;font-weight:500;opacity:0.95;line-height:1.4}
@media(max-width:768px){.step-desc{font-size:15px}}

/* CTA */
.cta-row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;width:100%}
@media(max-width:1024px){.cta-row{flex-direction:column;align-items:flex-start}}
.cta-stats{display:flex;gap:48px;margin-top:8px}
.cta-stat-val{color:#202020;font-size:40px;font-weight:700;line-height:1}
@media(max-width:768px){.cta-stat-val{font-size:36px}}
.cta-stat-label{color:#858489;font-size:16px;font-weight:500;margin-top:10px}
.cta-right{display:flex;flex-direction:column;align-items:flex-end;gap:14px}
@media(max-width:1024px){.cta-right{align-items:flex-start}}
.divider{width:100%;height:1px;background:#b9b9b9;opacity:0.4;margin:8px 0}
.tags-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.tags-label{font-size:22px;font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;line-height:normal;align-self:stretch;color:#0671bb}
@media(max-width:768px){.tags-label{font-size:20px}}

/* Big image */
.big-image-wrap{width:100%;height:616.734px;position:relative;border-radius:20px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,0.1)}
@media(max-width:768px){.big-image-wrap{height:357px}}
.big-image-wrap>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;border-radius:20px}
.big-image-card{position:absolute;backdrop-filter:blur(5.552px);background:rgba(255,255,255,0.4);display:flex;flex-direction:column;align-items:flex-start;left:55px;overflow:hidden;padding:14.642px 12.608px;border-radius:8.134px;top:50%;transform:translateY(-50%);width:510.83px}
@media(max-width:768px){.big-image-card{left:16px;width:calc(100% - 32px)}}
.big-image-inner{backdrop-filter:blur(5.552px);background:#fff;border-radius:8.134px;width:100%;display:flex;flex-direction:column;align-items:center;padding:16px 134px;gap:25px}
@media(max-width:768px){.big-image-inner{padding:16px 40px}}
.big-image-inner .logo-sm{height:57px;width:104px;object-fit:cover}
.big-image-inner .shopify-logo{width:207px;max-width:100%;position:relative;aspect-ratio:207/94;overflow:hidden}
.big-image-inner .shopify-logo img{position:absolute;width:99.84%;top:-31.91%;left:0;height:131.91%}

/* Footer */
.footer{width:100%;background:#f5f5f5;padding:60px 0 40px}
.footer-inner{max-width:1338px;margin:0 auto;padding:0 16px;display:flex;flex-direction:column;gap:32px}
@media(min-width:768px){.footer-inner{padding:0 89px}}
.footer-top{display:flex;flex-direction:column;gap:48px;align-items:flex-start}
@media(min-width:1024px){.footer-top{flex-direction:row;gap:110px}}
.footer-brand{display:flex;flex-direction:column;gap:10px;max-width:272px}
.footer-brand img{height:57px;object-fit:contain;object-position:left;width:max-content}
@media(max-width:768px){.footer-brand img{height:45px}}
.footer-brand p{color:#858489;font-size:14px;font-weight:500;line-height:1.6;margin-top:10px}
.footer-links{display:flex;flex-wrap:wrap;gap:60px;width:100%;font-size:14px;font-weight:500;margin-top:10px}
@media(min-width:1024px){.footer-links{gap:110px}}
@media(max-width:640px){.footer-links{flex-direction:column;gap:40px}}
.footer-col{display:flex;flex-direction:column;gap:12px}
.footer-col-title{color:#202020;margin-bottom:4px;font-weight:600;font-size:15px}
.footer-col a,.footer-col button{color:#858489;text-decoration:none;transition:color 0.2s;background:none;border:none;cursor:pointer;font-family:'Geist',sans-serif;font-size:14px;font-weight:500;text-align:left;padding:0;width:fit-content}
.footer-col a:hover,.footer-col button:hover{color:#0671bb}
.footer-copy{color:#858489;font-size:14px;font-weight:500}

/* Modals */
.modal-overlay{display:none;position:fixed;inset:0;z-index:50;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,0.5);backdrop-filter:blur(4px)}
.modal-box{background:#fff;border-radius:20px;width:100%;max-width:1000px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 25px 50px rgba(0,0,0,0.15);position:relative}
@media(min-width:768px){.modal-box{flex-direction:row}}
.modal-close{position:absolute;top:16px;right:16px;z-index:20;width:32px;height:32px;background:rgba(255,255,255,0.8);border-radius:50%;display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;color:#666;transition:background 0.2s}
.modal-close:hover{background:#eee;color:#000}
@media(min-width:768px){.modal-close{background:rgba(0,0,0,0.2);color:#fff}.modal-close:hover{background:rgba(0,0,0,0.4)}}

.modal-left{flex:1;padding:48px;overflow-y:auto;display:flex;flex-direction:column;justify-content:center}
@media(max-width:768px){.modal-left{padding:24px}}
.modal-form{display:flex;flex-direction:column;gap:24px}
.modal-form h2{font-size:40px;font-weight:500;color:#202020}
@media(max-width:768px){.modal-form h2{font-size:32px}}
.modal-form .form-subtitle{color:#858489;font-size:16px}
.form-row{display:flex;gap:16px}
@media(max-width:768px){.form-row{flex-direction:column}}
.form-group{flex:1;display:flex;flex-direction:column;gap:4px}
.form-group label{font-size:14px;font-weight:500;color:#202020}
.form-group label .req{color:#ef4444}
.form-group input,.form-group textarea{width:100%;padding:12px 16px;border-radius:12px;border:1px solid #e5e7eb;background:#f5f5f5;font-size:15px;font-family:'Geist',sans-serif;transition:all 0.2s;outline:none}
.form-group input:focus,.form-group textarea:focus{background:#fff;border-color:#0671bb;box-shadow:0 0 0 3px rgba(6,113,187,0.15)}
.form-group textarea{resize:none}

.modal-thanks{display:none;flex-direction:column;align-items:center;text-align:center;gap:24px;padding:48px}
.modal-thanks .check-circle{width:80px;height:80px;background:#dcfce7;color:#16a34a;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:36px}
.modal-thanks h2{font-size:40px;font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;line-height:normal;align-self:stretch;color:#202020}
@media(max-width:768px){.modal-thanks h2{font-size:32px}}
.modal-thanks p{color:#858489;font-size:16px;font-weight:500;max-width:300px}

.modal-right{display:none;position:relative;background:#0671bb;flex-direction:column;justify-content:flex-end;overflow:hidden}
@media(min-width:768px){.modal-right{display:flex;width:40%}}
@media(min-width:1024px){.modal-right{width:50%}}
.modal-right img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.6;mix-blend-mode:overlay}
.modal-right .gradient{position:absolute;inset:0;background:linear-gradient(to top,#002f54,rgba(6,113,187,0.4),transparent)}
.modal-right .content{position:relative;z-index:10;padding:48px;margin-bottom:16px}
.modal-right .content h3{color:#fff;font-size:40px;font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;line-height:normal;align-self:stretch;margin-bottom:12px}
.modal-right .content p{color:rgba(255,255,255,0.9);font-size:16px;font-weight:500;max-width:380px;line-height:1.6}

/* Info Modal */
.info-modal-box{background:#fff;width:100%;max-width:800px;max-height:85vh;border-radius:24px;box-shadow:0 25px 50px rgba(0,0,0,0.15);display:flex;flex-direction:column}
.info-header{display:flex;align-items:center;justify-content:space-between;padding:24px;border-bottom:1px solid #f3f4f6}
.info-title{font-size:32px;font-family:"Instrument Serif",serif;font-style:normal;font-weight:400;line-height:normal;align-self:stretch;color:#202020}
@media(max-width:768px){.info-title{font-size:28px}}
.info-close{padding:8px;border-radius:50%;border:none;background:none;cursor:pointer;color:#999;transition:background 0.2s,color 0.2s;display:flex;align-items:center;justify-content:center}
.info-close:hover{background:#f3f4f6;color:#000}
.info-body{padding:24px;overflow-y:auto;display:flex;flex-direction:column;gap:24px;color:#6a6b6f;font-size:15px;line-height:1.6}
.info-body h3{font-size:20px;font-family:"Instrument Serif",serif;font-style:normal;font-weight:400;line-height:normal;align-self:stretch;color:#202020;margin-bottom:8px}
