:root{
    --maroon-deep:#4a0606;
    --maroon:#5c0a0a;
    --maroon-dark:#2e0303;
    --cream:#fbf2e6;
    --cream-2:#f5e9d8;
    --ink:#3a1010;
    --ink-soft:#5c3a2e;
    --tan:#d9b48f;
    --gold-line:#a8763f;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth; scroll-padding-top:90px;}
  body{
    background:var(--maroon-dark);
    color:var(--ink);
    font-family:'Jost', sans-serif;
    overflow-x:hidden;
    -webkit-text-size-adjust:100%;
  }
  a{text-decoration:none; color:inherit;}
  img{max-width:100%; display:block;}

  .display{font-family:'Cormorant Garamond', serif; letter-spacing:.02em;}
  .logo-font{font-family:'Fredoka', sans-serif; font-weight:700;}
  .eyebrow{
    font-family:'Cormorant Garamond', serif;
    font-size:1.7rem;
    letter-spacing:.06em;
    line-height:1.15;
  }
  .eyebrow span{color:var(--maroon);}
  #events .eyebrow, #weddings .eyebrow, #birthdays .eyebrow{ font-weight:700; }
  .subheading{
    font-family:'Cormorant Garamond', serif; font-style:italic;
    font-size:1.15rem; letter-spacing:.08em; color:var(--maroon);
    text-transform:uppercase; line-height:1.15;
  }

  .inapp-banner{
    display:none; align-items:center; justify-content:space-between; gap:10px;
    background:var(--tan); color:var(--ink); font-size:.72rem; line-height:1.4;
    padding:9px 14px; text-align:left; position:relative; z-index:80;
  }
  .inapp-banner.show{ display:flex; }
  .inapp-banner button{
    background:none; border:none; color:var(--ink); font-size:1.2rem; line-height:1;
    cursor:pointer; flex-shrink:0; padding:2px 4px;
  }

  header{
    position:sticky; top:0; z-index:60;
    background:var(--maroon-dark);
    border-bottom:1px solid rgba(217,180,143,.25);
    padding:14px 18px;
    display:grid; grid-template-columns:1fr auto 1fr; align-items:center;
  }
  header .logo-font{
    grid-column:2; justify-self:center;
    color:var(--cream); font-size:1.15rem; letter-spacing:.04em;
  }
  .menu-btn{
    grid-column:3; justify-self:end;
    background:none; border:none; color:var(--cream); font-size:1.5rem;
    line-height:1; cursor:pointer; padding:4px 6px;
  }
  .mobile-nav{
    display:flex; flex-direction:column; background:var(--maroon-dark);
    position:fixed; top:0; left:0; right:0; bottom:0; z-index:70;
    padding:22px 24px; transform:translateX(100%);
    transition:transform .35s ease;
    overflow-y:auto;
  }
  .mobile-nav.open{transform:translateX(0);}
  .mobile-nav-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:30px;}
  .mobile-nav a{
    color:var(--cream); padding:14px 0; font-size:1.15rem; letter-spacing:.04em;
    border-bottom:1px solid rgba(217,180,143,.15);
    font-family:'Cormorant Garamond', serif;
  }
  .close-btn{background:none; border:none; color:var(--cream); font-size:1.7rem; cursor:pointer;}

  section{position:relative;}

  .hero{
    background:var(--cream);
    padding:44px 16px 64px;
    display:flex; justify-content:center;
  }
  .folder{
    position:relative;
    width:100%;
    max-width:420px;
    background:var(--maroon);
    border-radius:20px 20px 26px 26px;
    padding:44px 22px 40px;
    box-shadow:0 20px 40px rgba(0,0,0,.35);
  }
  .folder::before{
    content:""; position:absolute; top:-20px; left:24px;
    width:86px; height:22px; background:var(--maroon);
    border-radius:8px 8px 0 0;
  }
  .folder::after{
    content:""; position:absolute; top:-14px; left:120px;
    width:64px; height:16px; background:var(--tan);
    border-radius:6px 6px 0 0;
  }
  .folder-label{
    background:var(--cream); color:var(--ink); text-align:center;
    padding:12px 8px; border-radius:5px; font-size:.8rem;
    letter-spacing:.16em; font-weight:500; margin-bottom:20px;
  }
  .folder h1{
    color:var(--cream); text-align:center;
    font-size:clamp(2rem,10vw,2.5rem); line-height:1.05; letter-spacing:.01em;
    word-break:break-word; margin-bottom:0; position:relative; z-index:1;
  }
  .folder h1 em{font-style:italic; font-weight:500;}
  .folder-bottom-row{
    display:flex; align-items:flex-end; justify-content:space-between; gap:12px;
    position:relative; z-index:2; margin-top:clamp(-46px,-10vw,-30px);
  }
  .polaroid-mini{
    position:relative; width:88px; flex-shrink:0;
    background:#efe6d8; padding:5px 5px 14px;
    box-shadow:0 10px 20px rgba(0,0,0,.4);
    transform:rotate(-6deg); border-radius:2px;
  }
  .polaroid-mini .img-slot{
    width:100%; height:100px;
    background:linear-gradient(135deg,#caa27a,#8a5a3d);
    overflow:hidden;
  }
  .polaroid-mini .img-slot img{ width:100%; height:100%; object-fit:cover; display:block; }
  .clip{
    position:absolute; top:-14px; left:50%; transform:translateX(-50%) rotate(-8deg);
    width:22px; height:30px; border:4px solid #b0b0b0; border-radius:4px; background:transparent; z-index:3;
  }
  .brandmark{
    background:var(--cream);
    border-bottom:2px solid var(--ink); padding:5px 16px; font-size:1rem; letter-spacing:.04em;
    margin-bottom:6px;
  }

  .about-wrap{ background:var(--maroon); padding:56px 16px 66px; }
  .about-card{
    max-width:1000px; margin:0 auto; background:var(--cream); border-radius:22px;
    padding:30px 18px; display:flex; flex-direction:column; gap:26px;
    position:relative; box-shadow:0 16px 34px rgba(0,0,0,.3);
  }
  .about-text{ text-align:center; }
  .about-tab{
    display:inline-block; background:var(--maroon); color:var(--cream);
    font-family:'Cormorant Garamond', serif; font-style:italic; font-size:1.1rem;
    padding:7px 20px; transform:rotate(-2deg); margin-bottom:16px;
  }
  .about-text h2{ font-family:'Cormorant Garamond', serif; font-size:1.7rem; margin-bottom:12px; }
  .about-text p{ color:var(--ink-soft); line-height:1.65; margin-bottom:12px; font-size:.92rem; }
  .about-photo{
    width:220px; height:270px; align-self:center; flex-shrink:0;
    background:linear-gradient(135deg,#caa27a,#7a4a30); border-radius:18px;
    overflow:hidden; box-shadow:0 12px 24px rgba(0,0,0,.3); order:-1;
  }
  .about-photo img{ width:100%; height:100%; object-fit:cover; display:block; }

  .projects-wrap{ background:var(--maroon-dark); padding:56px 16px 66px; display:flex; justify-content:center; }
  .projects-folder{
    max-width:1000px; width:100%; background:var(--maroon); border-radius:26px;
    padding:34px 18px 40px; position:relative;
  }
  .projects-tabs{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:22px; }
  .proj-tab{
    background:var(--cream); border-radius:6px 6px 18px 18px; padding:20px 8px;
    text-align:center; font-family:'Cormorant Garamond',serif; font-size:.92rem;
    letter-spacing:.04em; position:relative; -webkit-tap-highlight-color:transparent;
  }
  .proj-tab::before{
    content:""; position:absolute; top:-8px; left:10px; width:34px; height:10px;
    background:var(--tan); border-radius:4px 4px 0 0;
  }
  .proj-tab:active{ transform:scale(.96); }

  .cream-section{ background:var(--cream); padding:56px 16px 66px; }
  .cream-section + .cream-section{ margin-top:-1px; }
  #events{ padding-bottom:10px; }
  #social-events, #corporate-events{ padding-top:8px; padding-bottom:10px; }
  #proposal{ padding-top:32px; }
  .inner{max-width:1080px; margin:0 auto;}
  .section-head{ margin-bottom:26px; }
  .section-head p.desc{ color:var(--ink-soft); line-height:1.65; font-size:.88rem; margin-top:10px; }

  .grid-4{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .thumb-card{
    height:clamp(90px,42vw,150px); background-color:#8a5a3d;
    background-size:cover; background-position:center;
    border:2.5px solid var(--maroon); border-radius:16px;
    display:flex; align-items:flex-end; justify-content:center;
    color:#fff; font-family:'Cormorant Garamond',serif; font-size:.85rem;
    text-align:center; padding:6px; position:relative; overflow:hidden; cursor:pointer;
  }
  .thumb-card video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000; }
  .thumb-card .thumb-label{
    position:relative; z-index:1; padding-bottom:4px;
    text-shadow:0 1px 3px rgba(0,0,0,.9), 0 2px 10px rgba(0,0,0,.9); font-weight:600;
  }
  .thumb-card-center{
    grid-column:1 / -1; justify-self:center;
    width:calc(50% - 6px);
  }
  .thumb-card-darker::before{
    content:""; position:absolute; inset:0; z-index:1;
    background:rgba(0,0,0,.55);
  }

  .scatter-grid{ position:relative; width:100%; max-width:460px; margin:20px auto 0; aspect-ratio:1/1.15; }
  .scatter-slot{
    position:absolute; background:linear-gradient(135deg,#e6c9a0,#8a5a3d);
    border:2.5px solid var(--maroon); border-radius:16px;
    overflow:hidden; cursor:pointer; box-shadow:0 12px 22px rgba(0,0,0,.22);
  }
  .scatter-slot video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000; }
  .scatter-slot.scatter-1{ top:0; left:4%; width:58%; height:40%; transform:rotate(-5deg); z-index:2; }
  .scatter-slot.scatter-2{ top:24%; left:38%; width:58%; height:38%; transform:rotate(5deg); z-index:1; }
  .scatter-slot.scatter-3{ top:64%; left:12%; width:64%; height:36%; transform:rotate(-3deg); z-index:2; }

  .scatter-grid-4{ position:relative; width:100%; max-width:460px; margin:20px auto 0; aspect-ratio:1/1.5; }
  .scatter-slot.s4-1{ top:0; left:2%; width:58%; height:28%; transform:rotate(-4deg); z-index:2; }
  .scatter-slot.s4-2{ top:20%; left:42%; width:56%; height:26%; transform:rotate(5deg); z-index:1; }
  .scatter-slot.s4-3{ top:46%; left:6%; width:54%; height:27%; transform:rotate(-3deg); z-index:2; }
  .scatter-slot.s4-4{ top:72%; left:38%; width:60%; height:26%; transform:rotate(4deg); z-index:1; }

  .polaroid-row{
    display:flex; gap:22px; overflow-x:auto; padding:28px 6px 20px;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  }
  .polaroid-row::-webkit-scrollbar{ height:4px; }
  .polaroid-row::-webkit-scrollbar-thumb{ background:rgba(90,40,20,.3); border-radius:4px; }
  .polaroid-frame{
    flex:0 0 auto; width:190px; background:#efe6d8; padding:9px 9px 32px;
    box-shadow:0 14px 24px rgba(0,0,0,.28); border-radius:3px;
    scroll-snap-align:start; cursor:pointer;
  }
  .polaroid-media{
    width:100%; aspect-ratio:4/5; position:relative; overflow:hidden;
    background:linear-gradient(135deg,#e6c9a0,#8a5a3d);
  }
  .polaroid-media video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000; }

  .split-panel{ display:flex; flex-direction:column-reverse; gap:22px; margin-top:8px; }
  .split-panel.reverse{ flex-direction:column; }
  .split-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .split-block{
    aspect-ratio:16/11; background:linear-gradient(135deg,#e6c9a0,#8a5a3d);
    border:2.5px solid var(--maroon); border-radius:14px;
    position:relative; overflow:hidden; cursor:pointer;
  }
  .split-block video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000; }
  .split-text{ position:relative; }
  .split-text .subheading{ display:block; margin-bottom:10px; }
  .split-text .desc{ color:var(--ink-soft); line-height:1.65; font-size:.88rem; }
  .split-text .sparkle{ display:block; color:var(--maroon); font-size:1.3rem; margin-top:14px; }
  .split-pagination{
    display:inline-flex; align-items:center; gap:10px; margin-top:16px;
    background:rgba(90,40,20,.08); border-radius:20px; padding:6px 16px;
    font-size:.8rem; color:var(--ink-soft);
  }
  .split-pagination button{
    background:none; border:none; cursor:pointer; font-size:1.1rem;
    color:var(--maroon); line-height:1; padding:0;
  }

  .filmstrip{
    border-radius:16px; padding:26px 16px;
    display:flex; gap:12px; overflow-x:auto; position:relative;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
    background-color:var(--ink);
    background-image:
      repeating-linear-gradient(to right, var(--cream) 0 8px, transparent 8px 20px),
      repeating-linear-gradient(to right, var(--cream) 0 8px, transparent 8px 20px);
    background-size:100% 9px, 100% 9px;
    background-position:0 8px, 0 calc(100% - 8px);
    background-repeat:repeat-x, repeat-x;
  }
  .filmstrip-frame{
    flex:0 0 auto; width:190px; aspect-ratio:4/3;
    background:linear-gradient(135deg,#e6c9a0,#8a5a3d);
    border:3px solid var(--cream); border-radius:4px;
    position:relative; overflow:hidden; cursor:pointer; scroll-snap-align:start;
  }
  .filmstrip-frame video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000; }

  .phone-row-wrap{ position:relative; }
  .swipe-hint{
    position:absolute; top:50%; right:2px; transform:translateY(-50%);
    width:32px; height:32px; border-radius:50%;
    background:var(--maroon); color:var(--cream);
    display:flex; align-items:center; justify-content:center;
    font-size:1.2rem; box-shadow:0 4px 12px rgba(0,0,0,.35);
    pointer-events:none; z-index:5;
    animation:swipeBounce 1.3s ease-in-out infinite;
  }
  @keyframes swipeBounce{
    0%,100%{ transform:translateY(-50%) translateX(0); opacity:1; }
    50%{ transform:translateY(-50%) translateX(7px); opacity:.7; }
  }

  .heading-arrow{
    display:inline-block; color:var(--maroon); font-size:1.15em;
    transform:rotate(-8deg); margin-left:2px;
  }

  .play-dot{
    width:34px; height:34px; border-radius:50%;
    background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.5);
    display:flex; align-items:center; justify-content:center;
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    transition:opacity .2s; z-index:2;
  }
  .play-dot::after{ content:""; border-left:10px solid #fff; border-top:7px solid transparent; border-bottom:7px solid transparent; margin-left:2px; }

  .note-box{
    margin-top:20px; font-size:.75rem; color:var(--ink-soft);
    border-top:1px solid rgba(90,40,20,.2); padding-top:12px;
  }

  /* ---------- phone-frame mockups (short form / intros) ---------- */
  .phone-row{
    display:flex; gap:12px; overflow-x:auto; padding:6px 4px 16px;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  }
  .phone-row::-webkit-scrollbar{ height:4px; }
  .phone-row::-webkit-scrollbar-thumb{ background:rgba(90,40,20,.3); border-radius:4px; }
  .phone-frame{
    flex:0 0 auto; width:108px; aspect-ratio:9/19;
    border:3px solid var(--maroon); border-radius:28px;
    background:linear-gradient(160deg,#7a3d3d,#2e0303);
    position:relative; overflow:hidden; scroll-snap-align:start;
  }
  .phone-frame::before{
    content:""; position:absolute; top:7px; left:50%; transform:translateX(-50%);
    width:32px; height:5px; background:rgba(255,255,255,.55); border-radius:3px; z-index:2;
  }
  .phone-frame .play-dot{ width:30px; height:30px; }
  .phone-frame .num-badge, .intro-frame .num-badge{
    position:absolute; top:10px; left:10px; width:28px; height:28px; border-radius:50%;
    background:var(--maroon); color:var(--cream); display:flex; align-items:center; justify-content:center;
    font-family:'Cormorant Garamond',serif; font-size:.9rem; box-shadow:0 4px 8px rgba(0,0,0,.3); z-index:3;
    border:1.5px solid rgba(255,255,255,.5);
  }
  .intro-frame{
    flex:0 0 auto; width:170px; aspect-ratio:3/4;
    border:3px solid var(--maroon); border-radius:16px;
    background:linear-gradient(160deg,#7a3d3d,#2e0303);
    position:relative; overflow:hidden; scroll-snap-align:start;
  }
  .phone-frame video, .intro-frame video{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000;
  }
  #highlights .phone-row{
    display:grid; grid-template-columns:repeat(2,1fr); gap:14px;
    overflow:visible; padding:6px 4px 16px;
  }
  #highlights .intro-frame{ width:100%; }
  #highlights .intro-frame:last-child{ grid-column:1 / -1; justify-self:center; width:calc(50% - 7px); }
  .phone-frame, .intro-frame{ cursor:pointer; }
  .play-dot.hidden{ opacity:0; pointer-events:none; }

  .expand-btn{
    position:absolute; top:8px; right:8px; z-index:5;
    width:26px; height:26px; border-radius:50%;
    background:rgba(0,0,0,.45); border:1px solid rgba(255,255,255,.55);
    display:flex; align-items:center; justify-content:center;
    cursor:pointer; transition:background .2s;
  }
  .expand-btn:hover{ background:rgba(0,0,0,.7); }
  .expand-btn svg{ width:13px; height:13px; display:block; }
  .tap-sticker{
    display:inline-flex; align-items:center; gap:5px;
    background:var(--maroon); color:var(--cream);
    font-size:.62rem; letter-spacing:.05em; text-transform:uppercase;
    padding:6px 12px; border-radius:14px; transform:rotate(-4deg);
    box-shadow:0 4px 10px rgba(0,0,0,.25);
  }
  .tap-sticker-wrap{ display:flex; justify-content:flex-end; margin-top:-6px; }
  .section-eyebrow-row{
    display:flex; align-items:center; gap:10px; margin-bottom:14px;
  }

  .maroon-card-wrap{ background:var(--maroon); padding:56px 16px 66px; }
  .maroon-card{
    max-width:1080px; margin:0 auto; background:var(--cream); border-radius:22px;
    padding:30px 18px; position:relative;
  }
  .services-grid{ display:grid; grid-template-columns:1fr; gap:16px; margin-top:22px; }
  .service-box{ border:1.5px solid var(--maroon); border-radius:16px; padding:16px; }
  .service-box h4{ font-size:.78rem; letter-spacing:.08em; margin-bottom:8px; }
  .service-box p{ font-size:.85rem; color:var(--ink-soft); line-height:1.55; }
  .footnote-strip{
    margin-top:20px; background:var(--maroon); color:var(--cream);
    padding:12px 16px; border-radius:16px; font-size:.78rem; text-align:center;
  }

  .cta-btn{
    display:inline-block; background:var(--maroon); color:var(--cream);
    padding:14px 34px; border-radius:26px; font-size:.9rem; letter-spacing:.05em;
    font-weight:500; box-shadow:0 10px 24px rgba(0,0,0,.25); transition:transform .2s;
  }
  .cta-btn:hover{ transform:translateY(-2px); }

  .faq-col{ padding:50px 16px; }
  .faq-col.cream{ background:var(--cream); }
  .faq-col.maroon{ background:var(--maroon); color:var(--cream); }
  .faq-item{ margin-bottom:22px; }
  .faq-item h4{ font-size:.78rem; letter-spacing:.05em; margin-bottom:7px; text-transform:uppercase; }
  .faq-item p{ font-size:.86rem; line-height:1.6; opacity:.9; }

  .reviews-wrap{ background:var(--maroon); padding:56px 16px 66px; }
  .reviews-card{
    max-width:1080px; margin:0 auto; background:var(--cream); border-radius:22px;
    padding:50px 18px 26px; display:flex; flex-direction:column; gap:20px; align-items:center;
    position:relative; overflow:hidden;
  }
  .reviews-tag{
    position:absolute; top:18px; left:24px; z-index:2;
    background:#fdfbf6; color:var(--ink);
    font-family:'Cormorant Garamond',serif; letter-spacing:.1em; font-size:.95rem;
    padding:10px 18px 8px; transform:rotate(-4deg);
    box-shadow:0 6px 14px rgba(0,0,0,.2);
  }
  .binder-clip{
    position:absolute; top:-14px; left:50%; transform:translateX(-50%);
    width:20px; height:14px; border:3px solid #9a9a9a; border-radius:3px; background:transparent;
  }
  .binder-clip::before{
    content:""; position:absolute; top:-9px; left:50%; transform:translateX(-50%);
    width:10px; height:10px; border-radius:50%; border:3px solid #9a9a9a; background:transparent;
  }
  .reviews-side-tab{
    position:absolute; top:50%; right:0; transform:translateY(-50%);
    writing-mode:vertical-rl;
    background:var(--tan); color:var(--ink); font-family:'Cormorant Garamond',serif;
    font-size:.85rem; letter-spacing:.08em; padding:14px 7px;
    border-radius:6px 0 0 6px; box-shadow:-2px 0 8px rgba(0,0,0,.15); z-index:2;
  }
  .bubble-col{ width:100%; display:flex; flex-direction:column; gap:10px; }
  .bubble-col.right{ align-items:flex-end; }
  .bubble{
    background:var(--ink); color:#fff; font-size:.78rem; line-height:1.45;
    padding:9px 13px; border-radius:14px;
    align-self:flex-start; max-width:88%; box-shadow:0 3px 8px rgba(0,0,0,.22);
  }
  .bubble-time{
    display:inline-block; font-size:.6rem; letter-spacing:.02em;
    margin-left:8px; opacity:.55; white-space:nowrap; vertical-align:bottom;
  }
  .review-photo{
    flex:0 0 auto; width:220px; height:220px;
    background:linear-gradient(135deg,#caa27a,#7a4a30);
    border-radius:68% 32% 68% 32% / 40% 62% 38% 60%;
    overflow:hidden;
  }
  .review-photo img{ width:100%; height:100%; object-fit:cover; display:block; }

  .contact-wrap{ background:var(--maroon); padding:56px 16px 66px; }
  .contact-inner{ max-width:1080px; margin:0 auto; }
  .contact-links{ display:flex; flex-direction:column; gap:12px; color:var(--cream); font-size:.82rem; margin-bottom:36px; }
  .contact-links a{ width:fit-content; transition:opacity .2s; }
  .contact-links a:hover{ opacity:.75; }
  .contact-main{ display:flex; flex-direction:column-reverse; align-items:center; gap:28px; text-align:center; }
  .contact-main h2{
    font-family:'Cormorant Garamond',serif; color:var(--cream); font-size:2.4rem; line-height:1.05;
  }
  .book-btn{
    display:inline-block; margin-top:20px; background:var(--cream); color:var(--maroon);
    padding:11px 26px; font-size:.88rem; letter-spacing:.04em; border-radius:2px;
  }
  .contact-photo{
    flex:0 0 auto; width:180px; height:235px; border-radius:12px;
    background:linear-gradient(135deg,#caa27a,#7a4a30);
    border:7px solid #efe6d8; border-bottom-width:26px;
    box-shadow:0 16px 32px rgba(0,0,0,.4); transform:rotate(3deg);
    overflow:hidden;
  }
  .contact-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
  .steps{ margin-top:32px; color:var(--cream); font-size:.84rem; line-height:1.8; opacity:.9; text-align:left; }
  .steps b{ font-weight:600; }

  footer{
    background:var(--maroon-dark); color:var(--cream); opacity:.6;
    text-align:center; padding:22px 16px; font-size:.7rem; letter-spacing:.06em;
  }

  .reveal{ opacity:0; }

  @media (min-width:700px){
    .eyebrow{font-size:2.1rem;}
    header{padding:16px 32px;}
    header .logo-font{font-size:1.3rem;}
    .mobile-nav{ padding:40px 60px; }
    .mobile-nav a{ font-size:1.6rem; max-width:480px; }

    .about-card{ flex-direction:row; align-items:center; gap:44px; padding:44px 50px; text-align:left; }
    .about-text{ text-align:left; }
    .about-photo{ flex:0 0 220px; width:220px; height:280px; order:0; }
    .projects-tabs{ grid-template-columns:repeat(4,1fr); gap:20px; }
    .scatter-grid, .scatter-grid-4{ max-width:600px; }
    .grid-4{ grid-template-columns:repeat(4,1fr); max-width:100%; }
    .thumb-card-center{ width:calc(25% - 9px); }
    .thumb-card{ height:clamp(150px,16vw,220px); }
    .phone-row{ flex-wrap:wrap; overflow:visible; justify-content:center; }
    .phone-frame{ width:130px; }
    .intro-frame{ width:260px; }
    .swipe-hint{ display:none; }
    .polaroid-row{ flex-wrap:wrap; overflow:visible; justify-content:center; }
    .polaroid-frame{ width:210px; }
    .split-panel{ flex-direction:row; align-items:center; gap:44px; }
    .split-panel.reverse{ flex-direction:row-reverse; }
    .split-grid{ flex:1 1 60%; }
    .split-text{ flex:1 1 40%; }
    .filmstrip{ flex-wrap:wrap; overflow:visible; justify-content:center; }
    .filmstrip-frame{ width:220px; }
    .services-grid{ grid-template-columns:1fr 1fr; }
    .faq-split{ display:grid; grid-template-columns:1fr 1fr; }
    .reviews-card{ flex-direction:row; justify-content:center; }
    .bubble-col{ flex:1 1 260px; }
    .contact-main{ flex-direction:row; justify-content:space-between; text-align:left; }
    .steps{ text-align:left; }
  }
  @media (min-width:1000px){
    .folder{ max-width:560px; padding:60px 40px 50px; }
    .folder h1{ font-size:4rem; }
  }
  @media (min-width:1300px){
    .inner, .about-card, .maroon-card, .reviews-card, .contact-inner{ max-width:1180px; }
    header{ padding:18px 48px; }

    .hero{ padding:70px 16px 90px; }
    .folder{ max-width:660px; padding:70px 50px 56px; }
    .folder h1{ font-size:5rem; }
    .folder-label{ font-size:.88rem; padding:14px 8px; }

    .eyebrow{ font-size:2.3rem; }
    .section-head p.desc, .about-text p{ font-size:1rem; max-width:760px; }
    .about-card{ padding:54px 64px; gap:60px; }
    .about-photo{ flex:0 0 260px; width:260px; height:320px; }
    .about-text h2{ font-size:2.1rem; }

    .thumb-card{ font-size:.95rem; }
    .phone-frame{ width:150px; }
    .intro-frame{ width:300px; }

    .service-box p{ font-size:.92rem; }
    .service-box h4{ font-size:.85rem; }
    .faq-item p{ font-size:.92rem; }
  }