:root{
    --ink:#14181d;
    --canvas:#f4f7f9;
    --canvas-alt:#e7eef3;
    --orange:#2684bf;
    --orange-dark:#184f73;
    --teal:#2684bf;
    --text:#191d22;
    --text-muted:#5c6570;
    --border:#d7e1e8;
    --white:#ffffff;
    --blue-light:#cfe7f5;
    --radius:6px;
    --shadow-hard:5px 5px 0 var(--ink);
    --shadow-hard-sm:3px 3px 0 var(--ink);
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--canvas);
    color:var(--text);
    font-family:'Work Sans',sans-serif;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  ul{list-style:none;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
  h1,h2,h3,h4{font-family:'Fraunces',serif;font-weight:680;font-optical-sizing:auto;letter-spacing:-0.01em;line-height:1.08;text-transform:none;}
  h1{font-weight:620;}
  .eyebrow{
    font-family:'Work Sans',sans-serif;
    font-size:13px;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--orange-dark);
    font-weight:700;
    display:inline-flex;
    align-items:center;
    gap:8px;
  }
  .eyebrow::before{content:'';width:8px;height:8px;background:var(--orange);border-radius:1px;}
  :focus-visible{outline:3px solid var(--teal);outline-offset:2px;}
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;}
  }

  /* halftone texture */
  .halftone{
    background-image:radial-gradient(var(--ink) 1px, transparent 1.4px);
    background-size:9px 9px;
    opacity:0.06;
    position:absolute;inset:0;
    pointer-events:none;
  }

  /* ---------- BUTTONS ---------- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:10px;
    font-family:'Work Sans',sans-serif;
    font-weight:700;
    font-size:15.5px;
    letter-spacing:0.01em;
    text-transform:none;
    padding:16px 26px;
    border:2px solid var(--ink);
    border-radius:var(--radius);
    background:var(--orange);
    color:var(--white);
    box-shadow:var(--shadow-hard);
    cursor:pointer;
    transition:transform 0.15s ease, box-shadow 0.15s ease;
    min-height:48px;
    white-space:nowrap;
  }
  .btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink);}
  .btn:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--ink);}
  .btn.ghost{background:transparent;color:var(--ink);}
  .btn.dark{background:var(--ink);color:var(--canvas);}
  .btn.sm{padding:11px 18px;font-size:13px;}
  .btn.block{width:100%;}

  /* ---------- NAV ---------- */
  header{
    position:sticky;top:0;z-index:100;
    background:rgba(242,237,225,0.92);
    backdrop-filter:blur(8px);
    border-bottom:2px solid var(--ink);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;max-width:1180px;margin:0 auto;}
  .logo{display:flex;align-items:center;gap:12px;font-family:'Fraunces',serif;font-weight:650;font-size:23px;text-transform:none;}
  .logo .mark{
    width:40px;height:40px;flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
  }
  .logo .mark img{width:100%;height:100%;object-fit:contain;}
  .footer-logo-img{height:42px;width:auto;margin-bottom:14px;}
  .logo .est{font-family:'Work Sans',sans-serif;font-size:11px;letter-spacing:0.04em;color:var(--text-muted);text-transform:none;display:block;font-weight:500;margin-top:-1px;}
  .nav-links{display:flex;align-items:center;gap:32px;}
  .nav-links a{font-family:'Work Sans',sans-serif;font-size:14.5px;font-weight:600;text-transform:none;letter-spacing:0.01em;position:relative;padding:4px 0;}
  .nav-links a::after{content:'';position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--orange);transition:width 0.2s;}
  .nav-links a:hover::after{width:100%;}
  .nav-cta{display:flex;align-items:center;gap:14px;}
  .nav .phone{display:none;}
  .hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px;}
  .hamburger span{width:24px;height:2.5px;background:var(--ink);display:block;}
  .drawer{
    position:fixed;inset:0;background:var(--canvas);z-index:200;
    display:flex;flex-direction:column;padding:24px;transform:translateX(100%);
    transition:transform 0.3s ease;
  }
  .drawer.open{transform:translateX(0);}
  .drawer-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:48px;}
  .drawer a{font-family:'Fraunces',serif;font-weight:620;font-size:30px;text-transform:none;padding:14px 0;border-bottom:1px solid var(--border);}
  .drawer-close{background:none;border:none;font-size:28px;cursor:pointer;padding:8px;}

  @media (max-width:900px){
    .nav-links{display:none;}
    .hamburger{display:flex;}
    .nav-cta .btn.ghost{display:none;}
  }

  /* ---------- HERO ---------- */
  .hero{position:relative;padding:88px 0 76px;overflow:hidden;border-bottom:2px solid var(--ink);}
  .hero .halftone{opacity:0.05;}
  .hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;position:relative;}
  .hero h1{font-size:clamp(42px,6vw,74px);margin:14px 0 22px;}
  .hero h1 .accent{color:var(--orange);}
  .hero p.lead{font-size:19px;color:var(--text-muted);max-width:520px;margin-bottom:32px;}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:36px;}
  .trust-row{display:flex;flex-wrap:wrap;gap:10px;}
  .trust-chip{
    font-family:'Work Sans',sans-serif;font-size:12px;font-weight:600;
    letter-spacing:0.02em;text-transform:uppercase;
    background:var(--white);border:1.5px solid var(--ink);border-radius:100px;
    padding:8px 14px;display:flex;align-items:center;gap:6px;
  }
  .trust-chip::before{content:'●';color:var(--teal);font-size:8px;}

  .hero-visual{position:relative;display:flex;align-items:center;justify-content:center;}
  .hero-visual .plate{
    background:var(--white);border:2px solid var(--ink);border-radius:10px;
    box-shadow:10px 10px 0 var(--ink);padding:28px;position:relative;
    width:100%;max-width:420px;
  }
  .hero-visual .ticket-label{
    font-family:'Work Sans',sans-serif;font-size:11px;text-transform:uppercase;
    letter-spacing:0.1em;color:var(--text-muted);display:flex;justify-content:space-between;
    border-bottom:1.5px dashed var(--border);padding-bottom:10px;margin-bottom:16px;
  }

  @media (max-width:900px){
    .hero-grid{grid-template-columns:1fr;}
    .hero-visual{order:-1;margin-bottom:8px;}
  }

  /* ---------- SECTION SHARED ---------- */
  section{padding:88px 0;position:relative;}
  .section-head{max-width:640px;margin-bottom:52px;}
  .section-head h2{font-size:clamp(32px,4.4vw,50px);margin-top:12px;}
  .section-head p{color:var(--text-muted);font-size:17px;margin-top:14px;}
  .section-head.center{margin-left:auto;margin-right:auto;text-align:center;}

  .reveal{opacity:0;transform:translateY(24px);transition:opacity 0.6s ease, transform 0.6s ease;}
  .reveal.in{opacity:1;transform:translateY(0);}

  /* ---------- DESIGNER (SIGNATURE INTERACTIVE) ---------- */
  .designer-section{background:var(--ink);color:var(--canvas);border-bottom:2px solid var(--ink);}
  .designer-section .section-head p{color:#c9c0ab;}
  .designer-section .eyebrow{color:var(--orange);}
  .designer-app{
    background:var(--canvas);border-radius:10px;border:2px solid var(--ink);
    box-shadow:10px 10px 0 var(--orange);
    overflow:hidden;color:var(--text);
  }
  .designer-grid{display:grid;grid-template-columns:1fr 380px;}
  .designer-canvas-wrap{
    padding:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;
    background:
      repeating-linear-gradient(0deg, transparent, transparent 27px, rgba(0,0,0,0.035) 27px, rgba(0,0,0,0.035) 28px),
      repeating-linear-gradient(90deg, transparent, transparent 27px, rgba(0,0,0,0.035) 27px, rgba(0,0,0,0.035) 28px);
    position:relative;
    min-height:520px;
  }
  .view-toggle{display:flex;gap:8px;margin-bottom:22px;background:var(--white);border:2px solid var(--ink);border-radius:100px;padding:4px;}
  .view-toggle button{
    font-family:'Work Sans',sans-serif;font-size:12.5px;font-weight:600;text-transform:uppercase;
    padding:8px 18px;border-radius:100px;border:none;background:transparent;cursor:pointer;letter-spacing:0.03em;
  }
  .view-toggle button.active{background:var(--ink);color:var(--canvas);}
  #shirtSvg{width:100%;max-width:340px;touch-action:none;user-select:none;}
  #shirtSvg .print-target{cursor:grab;}
  #shirtSvg .print-target:active{cursor:grabbing;}
  .canvas-hint{font-family:'Work Sans',sans-serif;font-size:11.5px;color:var(--text-muted);margin-top:16px;text-align:center;}

  .designer-controls{
    background:var(--white);border-left:2px solid var(--ink);
    padding:28px 26px;overflow-y:auto;max-height:none;
  }
  .ctrl-group{margin-bottom:26px;}
  .ctrl-group:last-child{margin-bottom:0;}
  .ctrl-label{
    font-family:'Work Sans',sans-serif;font-size:11.5px;font-weight:600;
    text-transform:uppercase;letter-spacing:0.08em;color:var(--text-muted);
    display:flex;justify-content:space-between;margin-bottom:10px;
  }
  .swatches{display:flex;flex-wrap:wrap;gap:8px;}
  .swatch{
    width:32px;height:32px;border-radius:100%;border:2px solid var(--ink);cursor:pointer;
    position:relative;flex-shrink:0;
  }
  .swatch.selected::after{
    content:'';position:absolute;inset:-5px;border:2px solid var(--orange);border-radius:100%;
  }
  select, input[type="text"], input[type="email"], input[type="tel"], textarea{
    width:100%;padding:12px 14px;border:2px solid var(--ink);border-radius:5px;
    font-family:'Work Sans',sans-serif;font-size:15px;background:var(--white);color:var(--text);
    min-height:48px;
  }
  select:focus, input:focus, textarea:focus{border-color:var(--orange);}
  input[type="range"]{width:100%;accent-color:var(--orange);height:24px;}
  .row2{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .file-btn{
    display:flex;align-items:center;justify-content:center;gap:8px;
    border:2px dashed var(--ink);border-radius:5px;padding:14px;cursor:pointer;
    font-family:'Work Sans',sans-serif;font-size:13px;font-weight:600;text-transform:uppercase;
    text-align:center;background:var(--canvas-alt);
  }
  .file-btn input{display:none;}
  .qty-tiers{display:flex;justify-content:space-between;font-family:'Work Sans',sans-serif;font-size:10.5px;color:var(--text-muted);margin-top:6px;text-transform:uppercase;}
  .summary-box{
    background:var(--canvas-alt);border:1.5px solid var(--border);border-radius:5px;padding:14px 16px;
    font-family:'Work Sans',sans-serif;font-size:12px;line-height:1.8;color:var(--text-muted);margin-bottom:18px;
  }
  .summary-box b{color:var(--text);}

  @media (max-width:960px){
    .designer-grid{grid-template-columns:1fr;}
    .designer-controls{border-left:none;border-top:2px solid var(--ink);}
  }

  /* ---------- SERVICES ---------- */
  .services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
  .service-card{
    background:var(--white);border:2px solid var(--ink);border-radius:var(--radius);
    padding:26px 22px;box-shadow:var(--shadow-hard-sm);transition:transform 0.15s, box-shadow 0.15s;
  }
  .service-card:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--orange);}
  .service-card .num{font-family:'Work Sans',sans-serif;color:var(--orange-dark);font-size:13px;font-weight:600;}
  .service-card h3{font-size:21px;margin:12px 0 10px;text-transform:none;letter-spacing:0;}
  .service-card p{color:var(--text-muted);font-size:14.5px;}
  @media (max-width:900px){.services-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.services-grid{grid-template-columns:1fr;}}

  /* ---------- PROCESS ---------- */
  .process-band{background:var(--canvas-alt);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);}
  .process-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;}
  .process-steps::before{
    content:'';position:absolute;top:20px;left:10%;right:10%;height:2px;
    background:repeating-linear-gradient(90deg, var(--ink) 0 8px, transparent 8px 16px);
    z-index:0;
  }
  .step{position:relative;z-index:1;padding:0 14px;text-align:center;}
  .step .dot{
    width:40px;height:40px;border-radius:100%;background:var(--ink);color:var(--canvas);
    display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
    font-family:'Work Sans',sans-serif;font-weight:600;font-size:14px;border:2px solid var(--ink);
  }
  .step h4{font-size:15.5px;text-transform:none;letter-spacing:0;margin-bottom:8px;font-family:'Work Sans',sans-serif;font-weight:700;}
  .step p{font-size:13.5px;color:var(--text-muted);}
  @media (max-width:900px){
    .process-steps{grid-template-columns:1fr 1fr;gap:32px 16px;}
    .process-steps::before{display:none;}
  }
  @media (max-width:560px){.process-steps{grid-template-columns:1fr;}}

  /* ---------- WHY / STATS ---------- */
  .stats-band{background:var(--ink);color:var(--canvas);}
  .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
  .stat h3{font-size:clamp(32px,4vw,48px);color:var(--orange);}
  .stat p{font-family:'Work Sans',sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:0.06em;color:#c9c0ab;margin-top:8px;}
  @media (max-width:700px){.stats-grid{grid-template-columns:1fr 1fr;}}

  .why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px;}
  .why-card{padding:26px 4px;border-top:3px solid var(--orange);}
  .why-card h3{font-size:19px;text-transform:none;letter-spacing:0;margin-bottom:10px;}
  .why-card p{color:var(--text-muted);font-size:14.5px;}
  @media (max-width:800px){.why-grid{grid-template-columns:1fr;}}

  /* ---------- GALLERY ---------- */
  .gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
  .gallery-tile{
    aspect-ratio:1;border-radius:var(--radius);border:2px solid var(--ink);
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    text-align:center;padding:20px;position:relative;overflow:hidden;
  }
  .gallery-tile svg{width:44px;height:44px;margin-bottom:12px;}
  .gallery-tile span{font-family:'Work Sans',sans-serif;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:0.03em;}
  @media (max-width:900px){.gallery-grid{grid-template-columns:1fr 1fr;}}

  /* ---------- MID CTA ---------- */
  .mid-cta{background:var(--orange);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);text-align:center;}
  .mid-cta h2{color:var(--white);font-size:clamp(30px,4.4vw,46px);}
  .mid-cta p{color:rgba(255,253,247,0.85);margin:14px 0 30px;font-size:17px;}
  .mid-cta .btn{background:var(--ink);color:var(--canvas);}
  .mid-cta .btn:hover{box-shadow:7px 7px 0 var(--white);}

  /* ---------- FORM ---------- */
  .form-section{background:var(--canvas-alt);border-bottom:2px solid var(--ink);}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:flex-start;}
  .form-sell ul{margin-top:22px;display:flex;flex-direction:column;gap:14px;}
  .form-sell li{display:flex;gap:12px;font-size:15px;}
  .form-sell li::before{content:'✓';color:var(--teal);font-weight:700;flex-shrink:0;}
  .form-card{
    background:var(--white);border:2px solid var(--ink);border-radius:10px;
    padding:32px;box-shadow:var(--shadow-hard);
  }
  .form-card h3{text-transform:none;letter-spacing:0;font-size:24px;margin-bottom:6px;}
  .form-card .sub{color:var(--text-muted);font-size:13.5px;margin-bottom:24px;font-family:'Work Sans',sans-serif;}
  .field{margin-bottom:16px;}
  .field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;}
  .field-error{color:var(--orange-dark);font-size:12px;margin-top:5px;display:none;}
  .field.error input, .field.error select, .field.error textarea{border-color:var(--orange-dark);}
  .field.error .field-error{display:block;}
  .privacy-note{font-size:12px;color:var(--text-muted);text-align:center;margin-top:14px;}
  .thankyou{display:none;text-align:center;padding:30px 10px;}
  .thankyou.show{display:block;}
  .thankyou .check{font-size:44px;margin-bottom:12px;}
  .form-card form.hidden{display:none;}
  @media (max-width:900px){.form-grid{grid-template-columns:1fr;}}

  /* ---------- FAQ ---------- */
  .faq-list{max-width:800px;margin:0 auto;}
  .faq-item{border-bottom:2px solid var(--ink);}
  .faq-q{
    width:100%;text-align:left;background:none;border:none;padding:22px 4px;
    display:flex;justify-content:space-between;align-items:center;cursor:pointer;
    font-family:'Work Sans',sans-serif;font-weight:700;font-size:17px;color:var(--text);
  }
  .faq-q .plus{font-family:'Work Sans',sans-serif;font-size:22px;color:var(--orange);transition:transform 0.2s;flex-shrink:0;margin-left:16px;}
  .faq-item.open .plus{transform:rotate(45deg);}
  .faq-a{max-height:0;overflow:hidden;transition:max-height 0.3s ease;}
  .faq-item.open .faq-a{max-height:300px;}
  .faq-a p{padding:0 4px 22px;color:var(--text-muted);font-size:15px;max-width:680px;}

  /* ---------- FOOTER ---------- */
  footer{background:var(--ink);color:var(--canvas);padding:64px 0 28px;}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:48px;}
  .footer-logo{font-family:'Fraunces',serif;font-weight:650;font-size:25px;text-transform:none;margin-bottom:12px;}
  footer p{color:#a89e8a;font-size:14px;}
  footer h4{font-family:'Work Sans',sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:0.08em;color:#a89e8a;margin-bottom:16px;font-weight:600;}
  footer ul li{margin-bottom:10px;font-size:14.5px;}
  footer ul li a:hover{color:var(--orange);}
  .footer-bottom{border-top:1px solid #3a3427;padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12.5px;color:#8b8271;}
  .footer-bottom a:hover{color:var(--orange);}
  @media (max-width:800px){.footer-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:500px){.footer-grid{grid-template-columns:1fr;}}

  /* ---------- MOBILE STICKY CTA ---------- */
  .sticky-cta{
    display:none;position:fixed;bottom:0;left:0;right:0;z-index:150;
    background:var(--canvas);border-top:2px solid var(--ink);padding:12px 16px;
    box-shadow:0 -4px 16px rgba(0,0,0,0.15);
  }
  @media (max-width:760px){
    .sticky-cta{display:block;}
    section{padding:64px 0;}
    body{padding-bottom:76px;}
  }