/*
Theme Name: Larissa 33444
Theme URI: https://larissagoncalvescosta.com.br
Author: Equipe de Campanha Larissa Goncalves Costa
Author URI: https://larissagoncalvescosta.com.br
Description: Tema de pagina unica (landing page) para a campanha de Larissa Goncalves Costa, candidata a Deputada Estadual pelo Parana - numero 33444.
Version: 1.1
Requires at least: 5.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: larissa33444
*/


  @import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500..700&family=Public+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');

  :root{
    --navy-950:#081120;
    --navy-900:#0b1c36;
    --navy-800:#132c4f;
    --navy-700:#1c3a63;
    --gold-600:#a97a1f;
    --gold-500:#c9982f;
    --gold-300:#e7c877;
    --gold-100:#f5e6bf;
    --paper:#f6f2e9;
    --paper-line:#e4dcc8;
    --ink-900:#151b24;
    --ink-600:#4a5364;
    --white:#ffffff;
    --brz-green:#1b6b3a;
    --brz-yellow:#e8b31a;
    --brz-blue:#1c3f7c;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--navy-950);
    color:var(--white);
    font-family:'Public Sans', system-ui, -apple-system, "Segoe UI", sans-serif;
    -webkit-font-smoothing:antialiased;
    padding-left:max(20px, env(safe-area-inset-left));
    padding-right:max(20px, env(safe-area-inset-right));
  }
  h1,h2,h3{
    font-family:'Fraunces', Georgia, 'Times New Roman', serif;
    font-weight:600;
    text-wrap:balance;
    margin:0;
  }
  p{margin:0;}
  a{color:inherit;}
  img{max-width:100%;display:block;}
  .eyebrow{
    font-family:'IBM Plex Mono', ui-monospace, Menlo, monospace;
    font-size:.72rem;
    font-weight:600;
    letter-spacing:.16em;
    text-transform:uppercase;
  }
  .wrap{
    max-width:1160px;
    margin:0 auto;
  }

  /* ---------- top strip ---------- */
  .topstrip{
    background:var(--navy-950);
    border-bottom:1px solid rgba(201,152,47,.25);
  }
  .topstrip .wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding-block:14px;
    flex-wrap:wrap;
  }
  .brandmark{
    display:flex;
    align-items:baseline;
    gap:10px;
  }
  .brandmark .name{
    font-family:'Fraunces', serif;
    font-weight:600;
    font-size:1.05rem;
    letter-spacing:.01em;
  }
  .brandmark .role{
    color:var(--gold-300);
  }
  .ballot-chip{
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid rgba(201,152,47,.45);
    border-radius:999px;
    padding:6px 14px 6px 8px;
    background:rgba(201,152,47,.06);
  }
  .ballot-chip .num{
    font-family:'IBM Plex Mono', monospace;
    font-weight:600;
    font-variant-numeric:tabular-nums;
    color:var(--navy-950);
    background:var(--gold-300);
    border-radius:999px;
    padding:3px 10px;
    font-size:.85rem;
    letter-spacing:.03em;
  }
  .ballot-chip .cap{
    font-size:.68rem;
    letter-spacing:.12em;
    color:var(--gold-100);
    text-transform:uppercase;
    font-family:'IBM Plex Mono', monospace;
  }

  /* ---------- hero ---------- */
  .hero{
    position:relative;
    background:
      radial-gradient(ellipse 900px 500px at 82% 8%, rgba(201,152,47,.16), transparent 60%),
      linear-gradient(160deg, var(--navy-900) 0%, var(--navy-950) 62%);
    overflow:hidden;
    border-bottom:1px solid rgba(201,152,47,.2);
  }
  .hero .wrap{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:56px;
    align-items:center;
    padding-block:64px 56px;
  }
  .hero-copy .eyebrow{color:var(--gold-300); margin-bottom:18px;}
  .hero-copy h1{
    font-size:clamp(2.3rem, 4.6vw, 3.6rem);
    line-height:1.05;
    color:var(--white);
  }
  .hero-copy h1 em{
    font-style:normal;
    color:var(--gold-300);
  }
  .hero-copy .sub{
    margin-top:22px;
    font-size:1.08rem;
    line-height:1.6;
    color:#cfd7e4;
    max-width:46ch;
  }
  .hero-copy .sub b{color:var(--gold-300); font-weight:600;}
  .cta-row{
    margin-top:34px;
    display:flex;
    gap:16px;
    flex-wrap:wrap;
  }
  .btn{
    font-family:'Public Sans', sans-serif;
    font-weight:600;
    font-size:.95rem;
    border-radius:8px;
    padding:14px 26px;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    gap:10px;
    transition:transform .15s ease, box-shadow .15s ease;
  }
  .btn:hover{transform:translateY(-1px);}
  .btn-gold{
    background:linear-gradient(180deg, var(--gold-300), var(--gold-600));
    color:var(--navy-950);
    box-shadow:0 10px 24px -10px rgba(201,152,47,.55);
  }
  .btn-ghost{
    border:1px solid rgba(255,255,255,.28);
    color:var(--white);
  }
  .btn-ghost:hover{border-color:var(--gold-300); color:var(--gold-300);}

  .hero-card{
    position:relative;
    justify-self:center;
    width:100%;
    max-width:360px;
  }
  .hero-card .frame{
    position:relative;
    border-radius:14px;
    padding:10px;
    background:linear-gradient(160deg, var(--gold-300), var(--gold-600) 60%, var(--gold-500));
    box-shadow:0 30px 60px -22px rgba(0,0,0,.6);
  }
  .hero-card .frame img{
    border-radius:8px;
    width:100%;
    aspect-ratio:348/426;
    object-fit:cover;
    display:block;
  }
  .hero-card .stamp{
    position:absolute;
    left:-18px;
    bottom:-22px;
    background:var(--navy-950);
    border:1px solid rgba(201,152,47,.5);
    border-radius:12px;
    padding:12px 16px;
    text-align:center;
    box-shadow:0 14px 30px -12px rgba(0,0,0,.55);
  }
  .hero-card .stamp .vote-label{
    font-family:'IBM Plex Mono', monospace;
    font-size:.62rem;
    letter-spacing:.18em;
    color:var(--gold-300);
    text-transform:uppercase;
  }
  .hero-card .stamp .vote-num{
    font-family:'IBM Plex Mono', monospace;
    font-weight:600;
    font-size:1.9rem;
    line-height:1.05;
    color:var(--white);
    font-variant-numeric:tabular-nums;
    letter-spacing:.02em;
  }
  .hero-card .stamp .vote-role{
    font-size:.62rem;
    letter-spacing:.06em;
    color:#c7cee0;
    margin-top:2px;
  }
  .hero-card .badge{
    position:absolute;
    right:-16px;
    top:-16px;
    width:92px;
    height:auto;
    aspect-ratio:546/426;
    object-fit:cover;
    border-radius:12px;
    border:2px solid var(--gold-300);
    box-shadow:0 12px 22px -8px rgba(0,0,0,.55);
  }

  /* ---------- section shells ---------- */
  section{padding-block:76px;}
  .sec-paper{
    background:var(--paper);
    color:var(--ink-900);
    border-bottom:1px solid var(--paper-line);
  }
  .sec-navy{
    background:
      radial-gradient(ellipse 700px 400px at 12% 0%, rgba(201,152,47,.10), transparent 55%),
      var(--navy-900);
    border-bottom:1px solid rgba(201,152,47,.2);
  }
  .kicker{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:16px;
  }
  .kicker .rule{
    width:34px;
    height:2px;
    background:var(--gold-500);
  }
  .sec-navy .kicker .eyebrow{color:var(--gold-300);}
  .sec-paper .kicker .eyebrow{color:var(--gold-600);}

  /* ---------- quem section ---------- */
  .quem-grid{
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    gap:52px;
    align-items:center;
  }
  .quem-photo{
    position:relative;
    border-radius:12px;
    overflow:hidden;
    border:1px solid var(--paper-line);
    box-shadow:0 24px 50px -28px rgba(20,30,50,.35);
  }
  .quem-photo img{width:100%; aspect-ratio:204/230; object-fit:cover;}
  .quem-copy h2{
    font-size:clamp(1.8rem, 3vw, 2.4rem);
    color:var(--navy-900);
  }
  .quem-copy .lede{
    margin-top:20px;
    font-family:'Fraunces', serif;
    font-weight:500;
    font-style:normal;
    font-size:1.28rem;
    line-height:1.5;
    color:var(--navy-800);
    max-width:52ch;
    border-left:3px solid var(--gold-500);
    padding-left:18px;
  }
  .quem-copy .body-txt{
    margin-top:20px;
    font-size:1rem;
    line-height:1.7;
    color:var(--ink-600);
    max-width:56ch;
  }
  .quem-copy .btn-outline{
    margin-top:26px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-weight:600;
    font-size:.94rem;
    color:var(--navy-900);
    border-bottom:2px solid var(--gold-500);
    padding-bottom:4px;
    text-decoration:none;
  }

  /* ---------- bandeiras ---------- */
  .band-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:24px;
    flex-wrap:wrap;
    margin-bottom:40px;
  }
  .band-head h2{
    font-size:clamp(1.8rem, 3vw, 2.4rem);
    color:var(--white);
    max-width:20ch;
  }
  .band-head .note{
    max-width:34ch;
    color:#b9c2d4;
    font-size:.96rem;
    line-height:1.6;
  }
  .band-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:22px;
  }
  .band-card{
    background:var(--navy-800);
    border:1px solid rgba(201,152,47,.28);
    border-radius:12px;
    padding:28px 26px;
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  .band-card .icon{
    width:44px;
    height:44px;
    border-radius:10px;
    background:linear-gradient(160deg, var(--gold-300), var(--gold-600));
    display:flex;
    align-items:center;
    justify-content:center;
    flex:none;
  }
  .band-card .icon svg{width:22px; height:22px; stroke:var(--navy-950);}
  .band-card h3{
    font-size:1.12rem;
    color:var(--white);
    line-height:1.3;
  }
  .band-card p{
    font-size:.94rem;
    line-height:1.62;
    color:#b9c2d4;
  }

  /* ---------- experiencia ---------- */
  .exp-wrap{
    display:grid;
    grid-template-columns:.9fr 2.1fr;
    gap:48px;
    align-items:start;
  }
  .exp-title h2{
    font-size:clamp(1.7rem, 2.8vw, 2.2rem);
    color:var(--navy-900);
  }
  .exp-title .accent{color:var(--gold-600);}
  .exp-list{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:28px 36px;
  }
  .exp-item{
    display:flex;
    gap:16px;
  }
  .exp-item .ic{
    flex:none;
    width:40px;
    height:40px;
    border-radius:50%;
    background:var(--white);
    border:1px solid var(--paper-line);
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .exp-item .ic svg{width:19px; height:19px; stroke:var(--navy-800);}
  .exp-item p{
    font-size:.94rem;
    line-height:1.6;
    color:var(--ink-600);
  }

  /* ---------- final cta ---------- */
  .final{
    background:linear-gradient(155deg, var(--navy-900), var(--navy-950));
    padding-block:60px 0;
  }
  .final-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:28px;
    flex-wrap:wrap;
    padding-bottom:44px;
    border-bottom:1px solid rgba(201,152,47,.25);
  }
  .final-top h2{
    font-size:clamp(1.7rem, 3vw, 2.3rem);
    max-width:26ch;
    color:var(--white);
  }
  .final-top h2 em{font-style:normal; color:var(--gold-300);}
  .final-vote{
    display:flex;
    align-items:center;
    gap:18px;
  }
  .final-vote .stamp{
    text-align:center;
  }
  .final-vote .vote-label{
    font-family:'IBM Plex Mono', monospace;
    font-size:.64rem;
    letter-spacing:.18em;
    color:var(--gold-300);
    text-transform:uppercase;
  }
  .final-vote .vote-num{
    font-family:'IBM Plex Mono', monospace;
    font-weight:600;
    font-size:2.3rem;
    color:var(--white);
    font-variant-numeric:tabular-nums;
  }
  .final-vote img{
    width:78px;
    height:auto;
    aspect-ratio:546/426;
    object-fit:cover;
    border-radius:10px;
    border:2px solid var(--gold-300);
  }

  .footer-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    flex-wrap:wrap;
    padding-block:26px;
  }
  .footer-row .fname{
    font-family:'Fraunces', serif;
    font-weight:600;
    font-size:1rem;
  }
  .footer-row .frole{
    color:#96a1b8;
    font-size:.85rem;
    margin-top:2px;
  }
  .sc-social{
    display:flex;
    align-items:center;
    gap:14px;
  }
  .sc-social a{
    width:36px;
    height:36px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.22);
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
  }
  .sc-social a svg{width:17px; height:17px; stroke:var(--gold-300); fill:none;}
  .handle{
    font-family:'IBM Plex Mono', monospace;
    font-size:.85rem;
    color:#c7cee0;
  }

  @media (max-width:860px){
    .hero .wrap{grid-template-columns:1fr; padding-block:44px 40px;}
    .hero-card{order:-1; max-width:280px;}
    .band-grid{grid-template-columns:1fr;}
    .quem-grid{grid-template-columns:1fr;}
    .exp-wrap{grid-template-columns:1fr;}
    .exp-list{grid-template-columns:1fr;}
    .final-top{flex-direction:column; align-items:flex-start;}
    .footer-row{flex-direction:column; align-items:flex-start;}
    section{padding-block:52px;}
  }

  @media (max-width:480px){
    .topstrip .wrap{flex-direction:column; align-items:flex-start; gap:8px;}
    .brandmark{flex-direction:column; gap:2px;}
  }