/* Elizabeth Chappell link in bio. Quilters Candy brand colors; Montserrat with Ms Madi for script accents. */
:root{
  --slate:#465259;--slate-ink:#2f383d;--arctic:#A5B5B9;--champagne:#DACEBE;
  --pearl:#FFF6F4;--cotton:#FAE6DF;--bubble:#F5D5CD;--coral:#E9A195;
  --coral-ink:#9C4E42; /* Neon Coral, darkened only for small text */
  --line:#ecdfd9;--ease:cubic-bezier(.2,.8,.2,1)
}
*,*::before,*::after{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--bubble) var(--pearl)}
body{background:var(--pearl);color:var(--slate);font:300 16px/1.55 Montserrat,system-ui,sans-serif;min-height:100vh;min-height:100dvh;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased}
::selection{background:var(--bubble);color:var(--slate-ink)}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
a:focus-visible{outline:2px solid var(--slate);outline-offset:3px;border-radius:8px}
img{display:block;max-width:100%}

.page{max-width:440px;margin:0 auto;padding:44px 20px 40px}

/* Intro */
.intro{text-align:center}
.mark{font-weight:500;font-size:12px;letter-spacing:.32em;text-transform:uppercase}
h1{margin:4px 0 8px;font-weight:400;line-height:1}
.script{font-family:"Ms Madi",cursive;font-size:54px;color:var(--slate-ink)}
.lede{font-size:15px;max-width:32ch;margin:0 auto;text-wrap:balance}

/* Featured cards: free pattern first, By Lamplight second */
.feature{display:flex;gap:16px;align-items:center;margin-top:28px;padding:12px 16px 12px 12px;background:var(--cotton);border-radius:18px;box-shadow:0 10px 26px -16px rgba(70,82,89,.4);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.feature + .feature{margin-top:12px}
.feature:hover{transform:translateY(-2px);box-shadow:0 16px 30px -18px rgba(70,82,89,.5)}
.feature:active{transform:scale(.985)}
.alt{background:#fff;box-shadow:0 0 0 1px var(--line),0 10px 26px -18px rgba(70,82,89,.35)}
.block{flex:none;width:96px;height:96px;border-radius:11px;object-fit:cover;background:var(--champagne)}
.feature-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.tag{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--coral-ink)}
.feature-title{font-weight:600;font-size:17px;line-height:1.28;color:var(--slate-ink);text-wrap:balance}
.feature-sub{font-size:13px}

/* Simple list */
.list{margin-top:14px}
.list a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;padding:12px 4px;border-bottom:1px solid var(--line);font-weight:500;font-size:16px;line-height:1.35;transition:color .2s}
.list a span{transition:transform .3s var(--ease)}
.list a small{display:block;font-weight:300;font-size:13px;margin-top:2px}
.list a i{flex:none;width:9px;height:9px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);margin-right:4px}
.list a:hover{color:var(--coral-ink)}
.list a:hover span{transform:translateX(8px)}
.list a:active{background:var(--cotton)}

/* Footer */
.foot{margin-top:34px;text-align:center}
.social{display:flex;justify-content:center;flex-wrap:wrap;gap:0 18px}
.social a{display:inline-flex;align-items:center;min-height:44px;font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase}
.social a:hover{color:var(--coral-ink)}
.home{font-size:13px}
.home a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--coral)}

/* Laptop: same calm column, a little more air */
@media (min-width:900px){
  .page{padding-top:88px}
  .script{font-size:62px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important}
  .feature:active,.list a:active{opacity:.85}
}
