:root{
  --cream:#f4eee4;
  --cream2:#fbf7f0;
  --olive:#354026;
  --olive2:#4c5937;
  --rust:#b65c35;
  --rust2:#9f4f30;
  --charcoal:#171816;
  --ink:#2b2d24;
  --sand:#d7c5ae;
  --white:#fffaf2;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'Montserrat',sans-serif;-webkit-font-smoothing:antialiased}
img{display:block;width:100%}
a{text-decoration:none}
.hero--desktop img{width:100%;height:auto}
.hero-mobile{display:none}
.orientation{position:relative;overflow:hidden;background:linear-gradient(135deg,#2f3920,#414d2d);color:var(--white);padding:56px 24px 48px;text-align:center}
.orientation-inner{position:relative;z-index:2;max-width:900px;margin:0 auto}
.orientation h2{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(42px,5vw,70px);margin:0 0 8px;letter-spacing:-.03em}
.orientation p,.eyebrow{font-size:12px;letter-spacing:.27em;font-weight:500}
.downline{display:block;width:1px;height:36px;background:rgba(255,255,255,.75);margin:28px auto 0}
.leaf{position:absolute;width:190px;height:190px;border:1px solid rgba(225,210,182,.25);border-radius:70% 0 70% 0;transform:rotate(24deg)}
.leaf-a{left:-90px;top:-72px}.leaf-b{right:-100px;bottom:-100px;transform:rotate(210deg)}
.brand-section{padding:86px clamp(24px,6vw,100px)}
.brand-olive{background:#f7f0e6}.brand-inked{background:#e7dccd}.brand-faith{background:#f1e6da}
.brand-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:0;align-items:stretch}
.brand-grid--reverse .arch-image{order:2}.brand-grid--reverse .brand-copy{order:1}
.arch-image{margin:0;min-height:560px;border-radius:48% 48% 0 0;overflow:hidden;position:relative;box-shadow:0 18px 46px rgba(45,35,25,.10)}
.arch-image img{height:100%;object-fit:cover}
.brand-copy{padding:70px clamp(34px,5vw,76px);display:flex;flex-direction:column;justify-content:center;min-height:560px}
.cream-card{background:rgba(250,245,237,.92);border-radius:0 46% 0 0}
.dark-card{background:#171816;color:var(--white);border-radius:46% 0 0 0}
.rust-card{background:var(--rust);color:var(--white);border-radius:0 46% 0 0}
.logo{object-fit:contain;object-position:left center;margin-bottom:26px}.olive-logo{max-width:480px}.inked-logo{max-width:390px;filter:invert(1)}
.eyebrow{margin:0 0 26px}.tagline{font-family:'Cormorant Garamond',serif;font-size:clamp(27px,3vw,38px);line-height:1.05;margin:0 0 22px}.description{font-family:'Cormorant Garamond',serif;font-size:20px;line-height:1.45;margin:0 0 34px;max-width:640px}.light-tag,.light-copy{color:#fff8ed}
.button{display:inline-flex;align-items:center;gap:14px;align-self:flex-start;padding:15px 22px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;transition:transform .2s ease,opacity .2s ease}.button:hover{transform:translateY(-2px)}.olive-button{background:var(--olive);color:var(--white)}.light-button{background:var(--white);color:var(--charcoal)}.cream-button{background:var(--cream2);color:var(--rust2)}
.faithmark{font-family:'Cormorant Garamond',serif;font-size:clamp(58px,7vw,96px);font-style:italic;line-height:.8;margin-bottom:28px}.faithmark span{font-family:'Montserrat',sans-serif;font-size:.42em;font-style:normal;font-weight:600;letter-spacing:.05em;margin-left:.1em}
.connect-section{padding:94px clamp(24px,7vw,120px);background:#f8f3ea}
.connect-grid{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:clamp(44px,7vw,100px)}
.connect-image{margin:0;border-radius:48% 48% 8px 8px;overflow:hidden;box-shadow:0 20px 60px rgba(55,43,30,.13)}
.connect-copy h2{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(46px,5vw,72px);line-height:.93;margin:10px 0 24px}.connect-copy h2 em{font-family:'Allura',cursive;color:var(--rust);font-weight:400;font-size:1.35em}.connect-types{font-size:11px;letter-spacing:.17em;line-height:2;margin-bottom:22px}.connect-copy>p:not(.eyebrow):not(.connect-types){font-family:'Cormorant Garamond',serif;font-size:21px;line-height:1.45;max-width:590px;margin:0 0 30px}.site-footer{background:#30391f}.site-footer img{width:100%;height:auto}

@media(max-width:760px){
  .hero--desktop{display:none}.hero-mobile{display:block;background:var(--cream2)}
  .mobile-namebar{padding:22px 26px 16px}.mobile-name{font-family:'Cormorant Garamond',serif;font-size:30px;line-height:.9;letter-spacing:.14em;margin:0;color:#303523}
  .mobile-photo{height:365px;overflow:hidden}.mobile-photo img{height:100%;object-fit:cover;object-position:58% 34%}
  .mobile-hero-copy{text-align:center;padding:26px 24px 38px;background:linear-gradient(180deg,#f8f2e9,#f3e9dc)}
  .mobile-themes{font-size:10px;line-height:1.8;letter-spacing:.17em;margin:0 0 22px}.mobile-themes span{color:var(--rust)}
  .mobile-hero-copy h1{margin:0;line-height:.73}.mobile-hero-copy .serif{display:block;font-family:'Cormorant Garamond',serif;font-size:75px;font-weight:500;color:#303523;letter-spacing:-.06em}.mobile-hero-copy .script{display:block;font-family:'Allura',cursive;color:var(--rust);font-size:104px;font-weight:400;margin-top:15px;transform:rotate(-3deg)}
  .lets-connect{font-size:14px;letter-spacing:.31em;margin:18px 0 16px}.beautiful{font-family:'Allura',cursive;font-size:35px;line-height:.85;margin:0;transform:rotate(-3deg)}
  .orientation{padding:44px 24px 38px}.orientation h2{font-size:45px;line-height:.92;max-width:300px;margin:0 auto 18px}.orientation p{font-size:10px;line-height:2;letter-spacing:.22em;max-width:280px;margin:0 auto}.downline{height:28px;margin-top:22px}
  .brand-section{padding:40px 18px 54px}.brand-grid,.brand-grid--reverse{display:flex;flex-direction:column;gap:0}.brand-grid--reverse .arch-image,.brand-grid--reverse .brand-copy{order:initial}
  .arch-image{min-height:340px;border-radius:50% 50% 0 0}.brand-copy{min-height:0;padding:42px 26px 46px;border-radius:0 0 22px 22px}.cream-card,.dark-card,.rust-card{border-radius:0 0 22px 22px}
  .logo{margin-bottom:20px}.olive-logo{max-width:330px}.inked-logo{max-width:280px}.eyebrow{font-size:9px;line-height:1.8;letter-spacing:.23em;margin-bottom:18px}.tagline{font-size:31px}.description{font-size:18px;margin-bottom:27px}.button{width:100%;justify-content:center;padding:16px 18px;font-size:10px}.faithmark{font-size:66px}
  .connect-section{padding:50px 18px 56px}.connect-grid{display:flex;flex-direction:column;gap:38px}.connect-image{border-radius:50% 50% 8px 8px}.connect-copy{text-align:center}.connect-copy h2{font-size:49px}.connect-copy .button{align-self:stretch}.connect-types{font-size:9px}.connect-copy>p:not(.eyebrow):not(.connect-types){font-size:18px}.site-footer{overflow:hidden}.site-footer img{width:180%;max-width:none;margin-left:-40%;min-height:235px;object-fit:cover}
}

/* V2 refinements: tighter editorial pacing + integrated logo */
.brand-section{padding-top:64px;padding-bottom:64px}
.brand-grid{max-width:1120px}
.arch-image,.brand-copy{min-height:520px}
.connect-section{padding-top:68px;padding-bottom:72px}
.connect-grid{max-width:1080px;gap:64px}
.connect-image{max-width:480px;justify-self:end}
.site-footer{line-height:0}
@media(min-width:761px){
  .brand-section + .brand-section{padding-top:58px}
  .brand-copy{padding-top:58px;padding-bottom:58px}
}
@media(max-width:760px){
  .brand-section{padding:28px 16px 36px}
  .arch-image{min-height:300px}
  .brand-copy{padding:32px 24px 36px}
  .connect-section{padding:36px 18px 42px}
  .connect-grid{gap:26px}
  .connect-image{max-width:100%;justify-self:auto}
  .orientation{padding-top:38px;padding-bottom:32px}
}

/* V3: mobile-first polish based on live phone QA */
@media(max-width:760px){
  .mobile-namebar{padding:18px 22px 13px}
  .mobile-name{font-size:27px;line-height:.88}
  .mobile-photo{height:300px}
  .mobile-photo img{object-position:55% 31%}
  .mobile-hero-copy{padding:20px 20px 27px}
  .mobile-themes{font-size:8.5px;line-height:1.65;margin-bottom:14px}
  .mobile-hero-copy .serif{font-size:58px}
  .mobile-hero-copy .script{font-size:78px;margin-top:10px}
  .lets-connect{font-size:10px;margin:12px 0 11px}
  .beautiful{font-size:28px;line-height:.82}

  .orientation{padding:30px 18px 25px}
  .orientation h2{font-size:37px;max-width:270px;margin-bottom:12px}
  .orientation p{font-size:8px;line-height:1.7;max-width:260px}
  .downline{height:20px;margin-top:15px}

  .brand-section{padding:20px 14px 26px}
  .brand-grid,.brand-grid--reverse{max-width:430px;margin-inline:auto}
  .arch-image{min-height:0;height:auto;aspect-ratio:1.72/1;border-radius:48% 48% 0 0;box-shadow:0 12px 30px rgba(45,35,25,.08)}
  .arch-image img{height:100%;object-fit:cover}
  .brand-copy{padding:27px 22px 30px}
  .logo{margin-bottom:15px}
  .olive-logo{max-width:285px}
  .inked-logo{max-width:245px}
  .eyebrow{font-size:8px;line-height:1.6;margin-bottom:12px}
  .tagline{font-size:27px;line-height:1.02;margin-bottom:15px}
  .description{font-size:16.5px;line-height:1.36;margin-bottom:21px}
  .button{min-height:46px;padding:13px 16px;font-size:9px}
  .faithmark{font-size:57px;margin-bottom:19px}

  .connect-section{padding:28px 14px 32px}
  .connect-grid{max-width:430px;margin-inline:auto;gap:24px}
  .connect-image{width:100%;aspect-ratio:1.72/1;border-radius:48% 48% 8px 8px;box-shadow:0 12px 30px rgba(55,43,30,.09)}
  .connect-image img{height:100%;object-fit:cover}
  .connect-copy h2{font-size:42px;line-height:.9;margin:7px 0 18px}
  .connect-types{font-size:8px;line-height:1.75;margin-bottom:14px}
  .connect-copy>p:not(.eyebrow):not(.connect-types){font-size:16.5px;line-height:1.38;margin-bottom:21px}
  .connect-copy .button{width:100%;justify-content:center}

  .site-footer img{width:150%;margin-left:-25%;min-height:190px}
}

/* V4: final mobile polish after live-phone QA */
@media(max-width:760px){
  /* Hero: cleaner hierarchy, stronger legibility, less visual noise */
  .mobile-namebar{padding:16px 20px 12px}
  .mobile-name{font-size:25px;letter-spacing:.16em}
  .mobile-photo{height:285px}
  .mobile-photo img{object-position:54% 30%}
  .mobile-hero-copy{padding:18px 20px 25px}
  .mobile-themes{font-size:8px;line-height:1.55;letter-spacing:.15em;margin-bottom:12px}
  .mobile-hero-copy h1{line-height:.78}
  .mobile-hero-copy .serif{font-size:55px;letter-spacing:-.045em}
  .mobile-hero-copy .script{font-size:73px;margin-top:8px;transform:rotate(-2deg)}
  .lets-connect{font-size:9.5px;letter-spacing:.28em;margin:10px 0 10px}
  .beautiful{font-size:27px;line-height:.88;transform:rotate(-2deg)}

  /* Transition: flatter, cleaner, less decorative competition */
  .orientation{padding:26px 18px 22px}
  .orientation h2{font-size:35px;line-height:.94;max-width:250px;margin-bottom:10px}
  .orientation p{font-size:7.8px;line-height:1.6;letter-spacing:.2em;max-width:250px}
  .downline{height:16px;margin-top:13px}
  .leaf{opacity:.45}

  /* Olive + Ember: give identity a touch more room */
  .brand-olive .brand-copy{padding-top:31px}
  .brand-olive .olive-logo{max-width:300px;margin-bottom:18px}
  .brand-olive .eyebrow{margin-bottom:13px}
  .brand-olive .tagline{margin-bottom:17px}

  /* Keep the other cards crisp and compact */
  .brand-inked .brand-copy,.brand-faith .brand-copy{padding-top:26px}
  .brand-inked .inked-logo{margin-bottom:14px}
  .brand-faith .faithmark{margin-bottom:16px}

  /* Angela CTA: intentional separation around the script word */
  .connect-copy h2{font-size:41px;line-height:.94;margin:6px 0 17px}
  .connect-copy h2 em{display:inline-block;margin:.04em .03em .02em;line-height:.72}
  .connect-copy .eyebrow{margin-bottom:9px}
  .connect-types{margin-bottom:13px}

  /* Footer: keep the strong ending while avoiding excess depth */
  .site-footer img{min-height:175px}
}

/* Keyboard accessibility without changing the visual language */
.button:focus-visible{outline:2px solid currentColor;outline-offset:4px}
