/* Stitched by Izz v2: styled after bogeyandbyrd.com (clean white, navy/logo-blue, sage, pink accents) */
:root{
  --navy:#345777;        /* main text + headings */
  --blue:#3f7491;        /* Stitched by Izz logo blue */
  --steel:#4f6e8c;       /* footer */
  --sage:#9eb681;        /* buttons + announcement */
  --sage-pale:#eef6e3;
  --sage-mid:#dcebc9;
  --pink:#d77bb0;        /* accent lines/icons */
  --pink-pale:#f8e3ec;
  --sky-pale:#e6eef6;
  --white:#fff;
  --muted:#5f7891;
  --max:1136px;
  --display:"Josefin Sans",Helvetica,sans-serif;
  --serif:"Cormorant Garamond",Georgia,serif;
  --label:"Montserrat",Helvetica,sans-serif;
  --body:"Questrial",Helvetica,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--body);font-size:15px;line-height:1.75;color:var(--navy);background:var(--white);overflow-x:clip}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:300;color:var(--navy)}
h2{font-family:var(--display);text-transform:uppercase;font-size:clamp(1.9rem,3.2vw,2.5rem);letter-spacing:.02em;line-height:1.1;margin-bottom:.5em}
h2.big{font-size:clamp(2.4rem,4.6vw,3.6rem)}
.center{text-align:center}
.eyebrow{font-family:var(--label);font-weight:500;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--navy);margin:0 0 1.1em}
.lede{max-width:560px;margin:0 auto 1.6rem;color:var(--muted)}
.section{padding:84px 20px}


/* ticket-shaped button (notched corners like B&B) */
.ticket{--n:9px;display:inline-block;background:var(--sage);color:#fff;font-family:var(--label);font-weight:600;font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;padding:1.15em 2.4em;border:0;cursor:pointer;line-height:1.2;
  -webkit-mask:radial-gradient(circle at 0 0,#0000 var(--n),#000 calc(var(--n) + .5px)) top left,radial-gradient(circle at 100% 0,#0000 var(--n),#000 calc(var(--n) + .5px)) top right,radial-gradient(circle at 0 100%,#0000 var(--n),#000 calc(var(--n) + .5px)) bottom left,radial-gradient(circle at 100% 100%,#0000 var(--n),#000 calc(var(--n) + .5px)) bottom right;
  -webkit-mask-size:51% 51%;-webkit-mask-repeat:no-repeat;
  mask:radial-gradient(circle at 0 0,#0000 var(--n),#000 calc(var(--n) + .5px)) top left,radial-gradient(circle at 100% 0,#0000 var(--n),#000 calc(var(--n) + .5px)) top right,radial-gradient(circle at 0 100%,#0000 var(--n),#000 calc(var(--n) + .5px)) bottom left,radial-gradient(circle at 100% 100%,#0000 var(--n),#000 calc(var(--n) + .5px)) bottom right;
  mask-size:51% 51%;mask-repeat:no-repeat;transition:background .2s}
.ticket:hover{background:#8aa56b}
.ticket-sm{--n:6px;padding:.95em 1.6em;font-size:.66rem}
.ticket-full{width:100%;font-size:.8rem}
.ticket-light{background:var(--sage-mid);color:var(--navy)}
.ticket-light:hover{background:#fff}

/* notched-top-corner images (B&B category tiles) */
.notch{--r:22px;
  -webkit-mask:radial-gradient(circle at 0 0,#0000 var(--r),#000 calc(var(--r) + .5px)) top left/51% 51% no-repeat,radial-gradient(circle at 100% 0,#0000 var(--r),#000 calc(var(--r) + .5px)) top right/51% 51% no-repeat,linear-gradient(#000,#000) bottom/100% 50% no-repeat;
  mask:radial-gradient(circle at 0 0,#0000 var(--r),#000 calc(var(--r) + .5px)) top left/51% 51% no-repeat,radial-gradient(circle at 100% 0,#0000 var(--r),#000 calc(var(--r) + .5px)) top right/51% 51% no-repeat,linear-gradient(#000,#000) bottom/100% 50% no-repeat}


/* announcement + header */
.announce{background:var(--sage);color:#fff;text-align:center;font-family:var(--label);font-weight:500;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;padding:13px 16px}
.site-header{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid #e6ecf1}
.header-inner{max-width:1240px;margin:0 auto;padding:0 32px;height:92px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;position:relative}
.nav-left{display:flex;gap:34px}
.nav-left a{font-family:var(--label);font-weight:500;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;text-decoration:none}
.nav-left a:hover{color:var(--pink)}
.logo{font-family:"Pinyon Script",cursive;font-size:2.45rem;color:var(--blue);text-decoration:none;line-height:1;white-space:nowrap}
.header-right{display:flex;justify-content:flex-end;align-items:center;gap:20px}
.icon-link svg{width:22px;height:22px;fill:none;stroke:var(--pink);stroke-width:1.6;display:block}
.icon-link .dot{fill:var(--pink);stroke:none}
.nav-toggle,.burger{display:none}

/* hero */
.hero{position:relative;min-height:560px;display:grid;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0}
.hero-content{position:relative;z-index:1;max-width:1240px;width:100%;margin:0 auto;padding:0 72px}
.hero-script{font-family:"Pinyon Script",cursive;color:#fff;font-size:2.4rem;margin:0 0 .1em;line-height:1}
.hero h1{font-family:var(--display);font-weight:300;text-transform:uppercase;color:#fff;font-size:clamp(2.6rem,5.6vw,4.4rem);line-height:1.04;letter-spacing:.01em;margin:0 0 30px;text-shadow:0 2px 18px rgba(30,50,70,.25)}

/* what we stitch */

/* pink double-line divider with monogram */
.divider{position:relative;height:16px;margin:10px 0;border-top:1.5px solid var(--pink);border-bottom:1.5px solid var(--pink);opacity:.85}
.monogram{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;padding:0 26px;font-family:"Pinyon Script",cursive;font-size:2.6rem;color:var(--blue);line-height:1}

/* gallery */
.gallery-section{padding-top:70px}
.gallery{max-width:var(--max);margin:0 auto 56px;display:grid;grid-template-columns:repeat(3,1fr);gap:44px 28px}
.g-item{margin:0}
.g-img{aspect-ratio:1/1;transition:transform .35s}
.g-item:hover .g-img{transform:scale(1.015)}
.g-lg{grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column}
.g-lg .g-img{aspect-ratio:auto;flex:1;min-height:420px}
figcaption{text-align:center;padding-top:16px;display:grid;gap:4px}
.g-title{font-family:var(--serif);font-size:1.45rem;font-weight:400;line-height:1.2}
.g-type{font-family:var(--label);font-weight:500;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}


/* marquee */
.marquee{background:var(--sage-pale);border-top:6px solid var(--sage-mid);border-bottom:6px solid var(--sage-mid);overflow:hidden;padding:26px 0}
.marquee-track{display:flex;align-items:center;gap:44px;width:max-content;animation:scroll 38s linear infinite}
.marquee span{font-family:var(--serif);font-size:2rem;white-space:nowrap;line-height:1}
.spool{width:26px;height:26px;border-radius:50%;flex:none;background:repeating-linear-gradient(0deg,var(--pink) 0 2px,#e9a6cb 2px 4px);box-shadow:0 0 0 3px #fff,0 0 0 4px var(--pink)}
@keyframes scroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none}}


/* contact form */
.contact{padding-top:96px;padding-bottom:96px}
.contact-form{max-width:680px;margin:36px auto 0;display:grid;gap:22px;padding:44px;border:1.5px solid var(--sky-pale);outline:1.5px solid var(--pink);outline-offset:8px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.contact-form label{display:grid;gap:6px;font-family:var(--label);font-weight:500;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;min-width:0}
.contact-form>*,.field-row>*{min-width:0}
.contact-form input,.contact-form select,.contact-form textarea{font-family:var(--body);font-size:.95rem;letter-spacing:0;text-transform:none;color:var(--navy);padding:.8em .2em;border:0;border-bottom:1px solid #a9bccb;background:transparent;width:100%;border-radius:0}
.contact-form textarea{border:1px solid #c6d4df;padding:.8em;resize:vertical}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:none;border-color:var(--navy)}
.form-note{margin:0;text-align:center;color:var(--muted);font-size:.85rem}

/* about: pinstripe frame like the B&B story */
.about{background:repeating-linear-gradient(90deg,var(--sky-pale) 0 14px,#fff 14px 28px);padding:80px 20px;border-bottom:8px solid #d5dee7}
.about-card{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;background:#fff}
.about-img{min-height:540px}
.about-copy{padding:60px 56px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.about-copy p{color:var(--muted);font-size:.95rem}
.about-copy .ticket{margin-top:12px}

/* follow */
.follow{padding:70px 20px;border-bottom:8px solid #d5dee7}
.follow-handle{display:block;text-align:center;font-family:var(--serif);font-size:2.4rem;text-decoration:none;line-height:1.2}
.follow-handle:hover{color:var(--pink)}

/* footer */
.site-footer{background:var(--steel);color:#fff;padding:64px 32px 28px}
.footer-inner{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:auto 1fr 1.3fr 1.3fr;gap:48px}
.badge{width:150px;aspect-ratio:1.1;display:grid;place-items:center;padding:14px;
  background:repeating-linear-gradient(90deg,#fff 0 4px,transparent 4px 9px);
  -webkit-mask:radial-gradient(circle at 0 0,#0000 18px,#000 18.5px) top left/51% 51% no-repeat,radial-gradient(circle at 100% 0,#0000 18px,#000 18.5px) top right/51% 51% no-repeat,radial-gradient(circle at 0 100%,#0000 18px,#000 18.5px) bottom left/51% 51% no-repeat,radial-gradient(circle at 100% 100%,#0000 18px,#000 18.5px) bottom right/51% 51% no-repeat;
  mask:radial-gradient(circle at 0 0,#0000 18px,#000 18.5px) top left/51% 51% no-repeat,radial-gradient(circle at 100% 0,#0000 18px,#000 18.5px) top right/51% 51% no-repeat,radial-gradient(circle at 0 100%,#0000 18px,#000 18.5px) bottom left/51% 51% no-repeat,radial-gradient(circle at 100% 100%,#0000 18px,#000 18.5px) bottom right/51% 51% no-repeat}
.badge span{background:var(--steel);width:100%;height:100%;display:grid;place-items:center;text-align:center;font-family:"Pinyon Script",cursive;font-size:1.7rem;line-height:1.05}
.f-head{font-family:var(--label);font-weight:500;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;margin:0 0 16px}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:.88rem}
.site-footer a{text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.f-cta p:not(.f-head){font-size:.88rem;margin:0 0 18px}
.footer-bottom{max-width:var(--max);margin:48px auto 0;display:flex;align-items:center;gap:18px;font-size:.78rem}
.footer-bottom p{margin:0}
.icon-pink svg{stroke:#f2a9d2}.icon-pink .dot{fill:#f2a9d2}

/* responsive */
@media (max-width:1000px){
  .nav-left{gap:20px}
  .footer-inner{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .header-inner{height:72px;padding:0 18px}
  .burger{display:block;width:26px;height:18px;position:relative;cursor:pointer}
  .burger span,.burger::before,.burger::after{content:"";position:absolute;left:0;right:0;height:1.5px;background:var(--navy)}
  .burger::before{top:0}.burger span{top:8px}.burger::after{bottom:0}
  .nav-left{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;gap:0;border-bottom:1px solid #e6ecf1}
  .nav-left a{padding:16px 24px;border-top:1px solid #eef2f5}
  .nav-toggle:checked ~ .nav-left{display:flex}
  .logo{font-size:2rem}
  .header-right .ticket{display:none}
  .hero{min-height:440px}
  .hero-content{padding:0 24px;text-align:center}
  .section{padding:64px 20px}
  .gallery{grid-template-columns:1fr 1fr;gap:30px 16px}
  .g-lg .g-img{min-height:340px}
  .g-title{font-size:1.2rem}
  .about-card{grid-template-columns:1fr}
  .about{padding:40px 18px}
  .about-img{min-height:320px}
  .about-copy{padding:40px 28px}
  .contact-form{padding:28px 22px}
  .marquee span{font-size:1.5rem}
}
@media (max-width:520px){
  .announce{font-size:.6rem;letter-spacing:.18em}
  .gallery{grid-template-columns:1fr 1fr}
  .g-lg{grid-column:span 2;grid-row:auto}
  .g-lg .g-img{min-height:0;aspect-ratio:1/1}
  .field-row{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr;gap:34px}
  .follow-handle{font-size:1.9rem}
  .hero h1{font-size:2.5rem}
}

/* ---- v5: real photography ---- */
.g-img,.about-img{position:relative;overflow:hidden;background:var(--sky-pale)}
.g-img img,.about-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.g-img{transition:none}
.g-img img{transition:transform .5s ease}
.g-item:hover .g-img{transform:none}
.g-item:hover .g-img img{transform:scale(1.04)}
.hero-bg{background:var(--navy)}
.hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 45%}
.hero::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(28,48,68,.82) 0%,rgba(28,48,68,.6) 38%,rgba(28,48,68,.12) 72%,rgba(28,48,68,0) 100%)}
.hero-content{z-index:1}
.hero h1{text-shadow:0 2px 20px rgba(10,25,40,.45)}
.hero-sub{color:#fff;font-family:var(--label);font-weight:500;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;margin:-14px 0 30px;text-shadow:0 1px 10px rgba(10,25,40,.5)}
.about-copy .about-hi{font-family:var(--serif);font-size:1.6rem;color:var(--navy)!important;margin:0 0 .3em;line-height:1.2}
.about-img img{object-position:center 30%}
.lede a{color:var(--navy)}
@media (max-width:820px){
  .hero{min-height:520px}
  .hero::after{background:rgba(28,48,68,.66)}
  .hero-sub{margin-top:-10px}
  .gallery .g-item:last-child{grid-column:auto}
  .gallery .g-item:last-child .g-img{aspect-ratio:1/1}
  .about-img{min-height:440px}
}

/* v6: 11-tile gallery; last tile spans 2 columns on desktop to fill the final row */
@media (min-width:821px){
  .gallery .g-item:last-child{grid-column:span 2}
  .gallery .g-item:last-child .g-img{aspect-ratio:2.08/1}
}
/* v6: hero flows into gallery via the monogram divider */
.divider{margin:56px 0 0}
.gallery-section{padding-top:48px}
@media (max-width:820px){.divider{margin-top:40px}.gallery-section{padding-top:36px}}

/* v7: live form */
.honey{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.optional{text-transform:none;letter-spacing:0;font-family:var(--body);color:var(--muted);font-size:.8rem}
.contact-form{position:relative}
.lede a,.site-footer a[href^="mailto"]{word-break:break-word}

/* thanks + 404 pages */
.simple-page main{min-height:calc(100vh - 420px)}
.message{padding:64px 20px 110px}
.message .divider{margin:0 0 60px}
.message-inner{max-width:640px;margin:0 auto;text-align:center}
.message-title{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(2.6rem,6vw,4rem);line-height:1.05;letter-spacing:.02em;margin:0 0 .2em}
.message-script{font-family:"Pinyon Script",cursive;color:var(--blue);font-size:2rem;margin:0 0 1em;line-height:1.2}
.message .lede a{color:var(--navy)}
.message-actions{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:28px}
