/* Fonts (SIL Open Font License, see assets/fonts/LICENSE-OFL.txt) */
@font-face{font-family:"Pinyon Script";font-style:normal;font-weight:400;font-display:swap;src:url("../assets/fonts/pinyon-script-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"IM Fell English";font-style:normal;font-weight:400;font-display:swap;src:url("../assets/fonts/im-fell-english-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"IM Fell English";font-style:italic;font-weight:400;font-display:swap;src:url("../assets/fonts/im-fell-english-latin-400-italic.woff2") format("woff2")}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:400;font-display:swap;src:url("../assets/fonts/playfair-display-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Italianno";font-style:normal;font-weight:400;font-display:swap;src:url("../assets/fonts/italianno-latin-400-normal.woff2") format("woff2")}
  /* =========================================================
     ANALOG SOCIETY: cores, fontes e medidas
     ========================================================= */
  :root{
    --velvet:#4B1220;        /* bordô veludo */
    --velvet-deep:#320A15;
    --wine:#6B1A2D;          /* bordô do cartão */
    --paper:#EDE3D0;         /* papel */
    --paper-light:#F7F1E6;
    --ink:#2B1A14;           /* tinta sépia */
    --ink-soft:#5E473A;
    --gold:#B09066;          /* filete dourado */
    --script:"Pinyon Script", cursive;
    --serif:"IM Fell English", Georgia, serif;
    --num:"Playfair Display", Georgia, serif;   /* números dos preços */
  }
  /* S mais legível no nome (letra emprestada da Italianno) */
  .s-alt{font-family:"Italianno",var(--script);font-size:1.15em;line-height:0}
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

  body{
    margin:0;
    font-family:var(--serif);
    font-size:19px;
    line-height:1.65;
    color:var(--ink);
    background:var(--velvet);
    background-image:
      radial-gradient(90% 60% at 50% 0%, rgba(255,255,255,.06), transparent 70%),
      radial-gradient(70% 50% at 50% 100%, rgba(0,0,0,.30), transparent 70%);
    background-attachment:fixed;
    min-height:100vh;
  }
  a{color:inherit}
  :focus-visible{outline:1px solid var(--gold);outline-offset:4px}

  html[data-lang="pt"] [data-l="en"],
  html[data-lang="en"] [data-l="pt"]{display:none!important}

  .skip{position:absolute;left:-999px;top:0;background:var(--paper);padding:.5rem 1rem;z-index:10}
  .skip:focus{left:1rem}

  /* ---------- topo ---------- */
  header.top{
    position:relative;max-width:1080px;margin:0 auto;padding:2rem 1.5rem 0;text-align:center;
  }
  .logo{
    font-family:var(--script);font-size:2.7rem;line-height:1;
    color:var(--paper-light);text-decoration:none;
  }
  .lang{position:absolute;right:1.5rem;top:2.2rem;display:flex;gap:.2rem;font-size:.9rem}
  .lang button{
    font:inherit;background:none;border:0;color:var(--paper);
    padding:.1rem .4rem;cursor:pointer;opacity:.55
  }
  .lang button[aria-pressed="true"]{opacity:1;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--gold)}

  nav.tabs{margin:1.1rem auto 0;padding:0 1.5rem}
  nav.tabs ul{
    list-style:none;margin:0 auto;padding:.7rem 0;display:flex;justify-content:center;flex-wrap:wrap;gap:.25rem 2.4rem;
    max-width:560px;border-top:1px solid rgba(176,144,102,.45);border-bottom:1px solid rgba(176,144,102,.45);
  }
  nav.tabs a{
    text-decoration:none;color:rgba(247,241,230,.78);font-size:1.02rem;letter-spacing:.02em;
    padding:.15rem 0;border-bottom:1px solid transparent;transition:color .2s ease,border-color .2s ease;
  }
  nav.tabs a:hover{color:var(--paper-light)}
  nav.tabs a[aria-current="page"]{color:var(--paper-light);border-bottom-color:var(--gold)}

  main{max-width:1080px;margin:0 auto;padding:2.5rem 1.5rem 4.5rem}
  .view{display:none;max-width:820px;margin:0 auto}
  .view.on{display:block}

  /* ---------- papel com moldura fina ---------- */
  .sheet{
    position:relative;
    background:var(--paper);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .25 0 0 0 0 .15 0 0 0 .06 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
    box-shadow:0 24px 50px rgba(15,3,6,.45), 0 2px 4px rgba(15,3,6,.25);
    padding:clamp(2.25rem,5.5vw,4rem);
  }
  .sheet::before,.sheet::after{content:"";position:absolute;pointer-events:none}
  .sheet::before{inset:14px;border:1px solid var(--gold)}
  .sheet::after{inset:19px;border:.5px solid rgba(176,144,102,.6)}

  h1,h2,h3{font-weight:400;margin:0}
  .script{font-family:var(--script);font-weight:400;line-height:1.15}
  h2.script{font-size:clamp(2.6rem,6vw,3.5rem)}
  .lede{font-style:italic;color:var(--ink-soft);max-width:32em;margin:.6rem 0 0}
  .center{text-align:center}
  .center .lede{margin-left:auto;margin-right:auto}
  .rule{display:block;width:150px;height:14px;margin:.9rem auto 1.3rem;color:var(--gold)}

  .btn{
    display:inline-block;font:inherit;font-size:1rem;letter-spacing:.02em;cursor:pointer;text-align:center;text-decoration:none;
    padding:.72rem 1.7rem;border-radius:0;border:1px solid var(--wine);
    background:var(--wine);color:var(--paper-light);
    transition:background .2s ease,color .2s ease;
  }
  .btn:hover{background:var(--velvet-deep);border-color:var(--velvet-deep)}
  .btn.ghost{background:transparent;color:var(--wine)}
  .btn.ghost:hover{background:var(--wine);color:var(--paper-light)}

  /* fotografia em janela oval (passe-partout) */
  .oval{
    border-radius:50%;overflow:hidden;
    box-shadow:0 0 0 1px var(--gold), inset 0 2px 10px rgba(0,0,0,.35);
    background:radial-gradient(circle at 50% 38%, #E6D2B2, #BF9E78);
    display:grid;place-items:center;
  }
  .oval img{width:100%;height:100%;object-fit:cover;display:block;filter:sepia(.15)}
  .oval .ph{font-style:italic;color:#6A4F3E;font-size:.95rem;text-align:center;padding:1rem}

  /* ---------- INÍCIO: cartão de duas folhas ---------- */
  .scene{position:relative;max-width:900px;margin:1.5rem auto 4rem}
  .folder{
    position:relative;display:grid;grid-template-columns:5fr 7fr;
    max-width:820px;margin:0 auto;
    box-shadow:0 26px 50px rgba(15,3,6,.5);
  }
  .folder .left{
    background:var(--wine);padding:2.5rem 2.25rem;display:grid;place-items:center;
    background-image:linear-gradient(90deg, rgba(0,0,0,0) 85%, rgba(0,0,0,.18));
  }
  .folder .left .oval{width:100%;max-width:250px;aspect-ratio:3/4;box-shadow:0 0 0 1px var(--gold), 0 0 0 7px var(--wine), 0 0 0 8px rgba(176,144,102,.55), inset 0 2px 10px rgba(0,0,0,.35)}
  .folder .right{box-shadow:none;text-align:center;display:flex;flex-direction:column;justify-content:center}
  .folder .from{font-style:italic;color:var(--ink-soft);font-size:1.02rem;margin:0}
  .folder h1{font-family:var(--script);font-size:clamp(3.6rem,8vw,5.6rem);line-height:1.05;margin:.4rem 0 0;color:var(--wine)}
  .folder .tagline{max-width:21em;margin:0 auto 1.8rem;font-size:1.12rem}
  .actions{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center}

  .sheet.inside{max-width:820px;margin:0 auto}
  .inside .items{
    list-style:none;padding:0;margin:2rem auto 0;max-width:820px;
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;text-align:center
  }
  .inside .items li{padding:0 .5rem}
  .inside .items h3{font-family:var(--script);font-size:2rem;color:var(--wine);line-height:1.1;margin-bottom:.4rem}
  .inside .items p{margin:0;font-size:1rem;color:var(--ink-soft)}
  .inside .items li + li{border-left:1px solid rgba(176,144,102,.5)}

  /* kit do mês */
  .kit{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:2.25rem;align-items:center;margin-top:2.25rem}
  .photo.kit-photo{aspect-ratio:4/5}
  .photo.kit-photo.has-img{aspect-ratio:auto}
  .kit-month{display:block;font-style:italic;color:var(--ink-soft);font-size:.95rem;margin-bottom:.2rem}
  .kit-list{margin:.6rem 0 0;padding-left:1.1rem}
  .kit-list li{margin:.35rem 0}
  .kit-list li::marker{color:var(--wine)}
  @media (max-width:760px){.kit{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto}}
  /* ---------- MAIL CLUB: planos como cartões de menu ---------- */
  .on-velvet{color:var(--paper-light)}
  .on-velvet .lede{color:rgba(237,227,208,.8)}
  .plans{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;
    max-width:620px;margin:2.25rem auto 3rem;
  }
  .plan{
    position:relative;background:var(--paper-light);text-align:center;
    padding:2.3rem 1.3rem 1.9rem;display:flex;flex-direction:column;
    box-shadow:0 18px 36px rgba(15,3,6,.4);
  }
  .plan::before{content:"";position:absolute;inset:10px;border:1px solid var(--gold);pointer-events:none}
  .plan .where{font-family:var(--script);font-size:2rem;line-height:1.1;color:var(--wine)}
  .plan .kind{font-style:italic;color:var(--ink-soft);font-size:.98rem}
  .plan .price{font-family:var(--num);font-variant-numeric:lining-nums;font-size:2.4rem;line-height:1;letter-spacing:.01em;margin:1.2rem 0 .3rem;color:var(--ink)}
  /* cifrão com um risco só: um "S" com uma linha fina desenhada por cima */
  .cif{position:relative;display:inline-block;line-height:1}
  .cif::before{content:"";position:absolute;top:.1em;bottom:.02em;left:var(--cif-l,calc(50% - .025em));width:var(--cif-w,.05em);min-width:1px;background:currentColor}
  .plan .per{font-size:.95rem;color:var(--ink-soft)}
  .plan .rule{margin:1.2rem auto 1rem}
  .plan p{font-size:.95rem;line-height:1.55;margin:0 0 1.5rem}
  .plan .btn{margin-top:auto;width:100%;padding-left:.75rem;padding-right:.75rem;font-size:.95rem}
  /* o cartão inteiro é clicável: a área do link do botão cobre o cartão todo */
  .plan .btn::after{content:"";position:absolute;inset:0;z-index:1}
  .plan{cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}
  .plan:hover{transform:translateY(-3px);box-shadow:0 24px 44px rgba(15,3,6,.48)}
  .plan:hover .btn{background:var(--velvet-deep);border-color:var(--velvet-deep)}

  .two-col{display:grid;grid-template-columns:1fr 1fr;gap:2.75rem}
  h3.sub{font-size:1.5rem;color:var(--wine)}
  .steps{list-style:none;counter-reset:s;padding:0;margin:1.25rem 0 0}
  .steps li{counter-increment:s;position:relative;padding-left:2.4rem;margin-bottom:1.1rem}
  .steps li::before{
    content:counter(s) ".";position:absolute;left:0;top:0;
    font-family:var(--script);font-size:1.6rem;line-height:1.2;color:var(--gold)
  }
  details{border-top:1px solid rgba(176,144,102,.5);padding:.8rem 0}
  details:last-of-type{border-bottom:1px solid rgba(176,144,102,.5)}
  summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem}
  summary::-webkit-details-marker{display:none}
  summary::after{content:"+";color:var(--gold);font-size:1.25rem;line-height:1.2}
  details[open] summary::after{content:"\2013"}
  details p{margin:.5rem 0 0;color:var(--ink-soft);font-size:1rem}

  /* ---------- PRINTS ---------- */
  .prints{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:2.5rem 1.75rem;margin-top:2.25rem;align-items:start}
  .print a.card-link{display:block;text-decoration:none;color:inherit}
  .print figure{margin:0}
  .print .photo{transition:opacity .25s ease}
  .print a.card-link:hover .photo{opacity:.88}
  .print a.card-link:hover .name{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:4px}
  .photo{
    aspect-ratio:2/3;overflow:hidden;display:grid;place-items:center;
    background:linear-gradient(160deg,#E2CFAF,#C8A985);
  }
  .photo img{width:100%;height:100%;object-fit:cover;display:block}
  .photo .ph{font-style:italic;color:#6A4F3E;font-size:.95rem}
  .photo.has-img{aspect-ratio:auto;background:none}   /* foto real: sempre inteira, sem corte */
  .photo.has-img img{height:auto}
  .print figcaption{margin:.9rem 0 0;text-align:center}
  .print .name{display:block;font-size:1.12rem}
  .print .p{display:block;color:var(--ink-soft);font-size:.95rem}
  .print .p > span:last-child{font-family:var(--num);font-variant-numeric:lining-nums;font-size:.88rem}

  /* página de cada print */
  .back{display:inline-block;font-size:.95rem;color:var(--ink-soft);text-decoration:none;margin-bottom:1.5rem}
  .back:hover{color:var(--wine);text-decoration:underline;text-underline-offset:4px}
  .detail{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
  .detail h2.script{font-size:clamp(2.4rem,5vw,3rem);color:var(--wine)}
  .detail .desc{margin:.5rem 0 1.25rem;color:var(--ink-soft);font-style:italic}
  .about-print{font-size:1rem;margin:.8rem 0 1.4rem;text-align:justify;hyphens:none}
  .sizes{margin:0 0 1.5rem}
  .sizes .label{display:block;font-size:.95rem;color:var(--ink-soft);margin-bottom:.45rem}
  .sizes .opts{display:flex;flex-wrap:wrap;gap:.5rem}
  .sizes button{
    font-family:var(--num);font-variant-numeric:lining-nums;font-size:.88rem;cursor:pointer;padding:.4rem 1.1rem;border-radius:999px;
    background:transparent;color:var(--wine);border:1px solid var(--wine);transition:background .2s ease,color .2s ease;
  }
  .sizes button[aria-pressed="true"]{background:var(--wine);color:var(--paper-light)}
  .specs{margin:0 0 1.75rem;border-top:1px solid rgba(176,144,102,.5)}
  .specs div{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid rgba(176,144,102,.5);font-size:1rem}
  .specs dt{color:var(--ink-soft)}
  .specs dd{margin:0;text-align:right;font-family:var(--num);font-variant-numeric:lining-nums;font-size:.9rem}
  .buy h3{font-size:1.25rem;color:var(--wine);margin-bottom:.75rem}
  .option{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0}
  .option + .option{border-top:1px solid rgba(176,144,102,.35)}
  .option .region{display:block;font-size:1rem}
  .option .amount{display:block;font-family:var(--num);font-variant-numeric:lining-nums;font-size:1.4rem;line-height:1.2}
  .option .btn{padding:.55rem 1.2rem;font-size:.95rem;white-space:nowrap}
  .buy .small{font-size:.9rem;color:var(--ink-soft);margin:.75rem 0 0}

  /* ---------- SOBRE ---------- */
  .about{display:grid;grid-template-columns:220px minmax(0,410px);justify-content:center;gap:3rem;align-items:stretch}
  .arch{position:relative;height:calc(100% - 24px);margin:12px}
  .arch img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block;border-radius:999px 999px 0 0}
  .arch::after{
    content:"";position:absolute;inset:-10px;border:1px solid var(--gold);
    border-radius:999px 999px 0 0;pointer-events:none;
  }
  .socials{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:1.4rem}
  .social{
    display:inline-block;padding:.28rem .95rem;border-radius:999px;
    background:var(--wine);color:var(--paper-light);text-decoration:none;
    font-size:.88rem;letter-spacing:.03em;transition:background .2s ease;
  }
  .social:hover{background:var(--velvet-deep)}
  .manage{margin-top:1.25rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.25rem}
  .about p{text-align:justify;hyphens:none;-webkit-hyphens:none}
  .manage .btn{padding:.5rem 1.2rem;font-size:.92rem}
  .manage .addr{font-size:.95rem;color:var(--ink-soft)}

  .hire{max-width:520px;margin:2.75rem auto 0;text-align:center}
  .hire .rule{margin:0 auto 1.5rem}
  .hire h3{font-family:var(--script);font-size:2.3rem;line-height:1.15;color:var(--wine);margin-bottom:.5rem}
  .hire p{margin:0 0 1.4rem}
  .hire .mail{display:block;margin-top:.7rem;font-size:.92rem;color:var(--ink-soft);font-style:italic}
  footer .hire-link{display:block;margin-top:.35rem}

  footer{text-align:center;color:rgba(237,227,208,.7);font-size:.92rem;padding:0 1.5rem 2.75rem}
  footer .script{font-size:2rem;color:var(--paper-light);display:block}
  footer a{color:var(--paper-light)}

  .toast{
    position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%,150%);
    background:var(--ink);color:var(--paper-light);padding:.7rem 1.2rem;
    font-size:.98rem;transition:transform .3s ease;z-index:20;max-width:90vw;text-align:center;visibility:hidden
  }
  .toast.show{transform:translate(-50%,0);visibility:visible}

  /* ---------- formulário de contato ---------- */
  body:has(dialog[open]){overflow:hidden}
  .contact-dialog{
    border:0;padding:0;background:transparent;color:var(--ink);
    width:calc(100% - 32px);max-width:620px;max-height:calc(100dvh - 32px);overflow:auto;
  }
  .contact-dialog::backdrop{background:rgba(32,6,13,.72)}
  .contact-dialog .sheet{padding:clamp(2.4rem,5vw,3.25rem) clamp(1.75rem,5vw,3.25rem)}
  .contact-dialog .close{
    position:absolute;top:24px;right:26px;z-index:1;
    font:inherit;font-size:1.9rem;line-height:1;background:none;border:0;color:var(--wine);cursor:pointer;padding:.1rem .35rem
  }
  .contact-dialog h2.script{font-size:clamp(2.4rem,6vw,3rem);color:var(--wine)}
  .contact-dialog .lede{margin-bottom:1.6rem}
  #contact-form{display:grid;gap:1rem}
  #contact-form .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
  #contact-form label{display:block}
  #contact-form .lbl{display:block;font-size:.95rem;margin-bottom:.3rem;color:var(--ink-soft)}
  #contact-form .lbl em{font-size:.85em}
  #contact-form input,#contact-form select,#contact-form textarea{
    width:100%;font:inherit;font-size:1rem;color:var(--ink);
    background:var(--paper-light);border:1px solid rgba(176,144,102,.75);border-radius:0;padding:.55rem .7rem;
  }
  #contact-form textarea{resize:vertical;min-height:7.5rem}
  #contact-form input:focus,#contact-form select:focus,#contact-form textarea:focus{outline:1px solid var(--wine);outline-offset:0;border-color:var(--wine)}
  #contact-form [aria-invalid="true"]{border-color:#9b2335;outline:1px solid #9b2335}
  #contact-form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
  #contact-form .btn{margin-top:.4rem;min-width:13rem}
  #contact-form .btn[disabled]{opacity:.65;cursor:wait}
  .form-error{margin:0;color:#9b2335;font-size:.95rem;text-align:center}
  #contact-done .btn{margin-top:1.4rem;min-width:8rem}

  /* ---------- celular ---------- */
  @media (max-width:820px){
    .plans{grid-template-columns:1fr;max-width:400px;margin-left:auto;margin-right:auto}
    .two-col{grid-template-columns:1fr;gap:2.25rem}
    .about{grid-template-columns:1fr;text-align:center}
    .about{grid-template-columns:minmax(0,410px)}
    .arch{max-width:200px;width:100%;height:auto;aspect-ratio:3/4;margin:12px auto}
    .arch img{object-position:50% 20%}
    .detail{grid-template-columns:1fr;gap:1.75rem}
    .manage,.socials{justify-content:center}
    .inside .items{grid-template-columns:1fr;gap:1.5rem}
    .inside .items li + li{border-left:0;border-top:1px solid rgba(176,144,102,.5);padding-top:1.5rem}
  }
  @media (max-width:680px){
    .folder{grid-template-columns:1fr}
    .folder .left{padding:2rem 2rem 2.25rem}
    .folder .left .oval{max-width:200px}
  }
  @media (max-width:560px){
    body{font-size:18px}
    header.top{padding-top:1.4rem}
    .logo{font-size:2.3rem}
    .lang{position:static;justify-content:center;margin-top:.4rem}
    nav.tabs ul{gap:.25rem 1.5rem}
    #contact-form .row{grid-template-columns:1fr}
    .contact-dialog .close{top:20px;right:20px}
  }