@charset "UTF-8";

/* =======================================
   1. 基本設定
======================================= */
body {
    margin: 0;
    font-family: 'Noto Sans JP', sans-serif;
    color: #4A3C3F; /* ★メインテキスト：ディープローズブラウン（柔らかく上品な焦げ茶） */
    line-height: 1.8;
    -webkit-font-smoothing: antialiased;
    background-color: #fff;
    overflow-x: hidden;
}
.font-serif {
    font-family: 'Noto Serif JP', serif;
}
.container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
}
section {
    padding: 100px 0;
}
a {
    text-decoration: none;
    transition: 0.3s;
    color: #4A3C3F; 
}

/* =======================================
   2. ヘッダー＆ナビゲーション
======================================= */
header {
    position: fixed;
    top: 0;
    width: 100%;
    height: 80px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    z-index: 1000;
    border-bottom: 1px solid #FCEDF0; /* ★薄いピンクのラインに */
}
.header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}
.logo {
    display: block;
    z-index: 1001;
}
.logo img {
    height: 45px;
    width: auto;
    vertical-align: middle;
}
.header-right {
    display: flex;
    align-items: center;
    margin-left: auto;
}
nav {
    display: flex;
    align-items: center;
}
nav a {
    color: #827175; /* ★サブテキスト：モーブブラウン */
    margin-right: 25px;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    white-space: nowrap;
}
nav a:hover {
    color: #C9738C; /* ★華やかなローズピンク */
}
.header-tel {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    padding-left: 25px;
    border-left: 1px solid #FCEDF0;
}
.header-tel-label {
    font-size: 0.7rem;
    color: #B49A9F;
    margin-bottom: 2px;
    line-height: 1;
}
.header-tel-number {
    font-size: 1.2rem;
    color: #4A3C3F; 
    font-weight: 700;
    line-height: 1;
}
.header-tel-number:hover {
    color: #C9738C; 
}
.sp-tel-icon {
    display: none;
}
.menu-toggle {
    display: none;
}

/* =======================================
   3. 共通コンポーネント
======================================= */
.section-tag {
    display: block;
    text-align: center;
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    color: #C9738C; /* ★華やかさをプラス */
    margin-bottom: 15px;
    text-transform: uppercase;
}
.section-title {
    text-align: center;
    font-size: 2rem;
    margin-bottom: 70px;
    letter-spacing: 0.1em;
    color: #4A3C3F; 
}

/* =======================================
   4. ヒーローセクション
======================================= */
.hero {
    height: 90vh;
    min-height: 650px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    background: #fff;
}
.hero > .container {
    width: 100%;
    position: relative;
    z-index: 10;
}
.hero-content {
    width: 100%;
    display: grid;
    grid-template-columns: auto 1fr; 
    column-gap: 50px;
    row-gap: 20px;
    align-items: center;
}
.hero-text-wrap {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    max-width: 550px;
    text-align: left;
}
.hero-btn-wrap {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
}
.hero-badges-area {
    grid-column: 2 / 3;
    grid-row: 1 / 3;
    display: flex;
    gap: 20px;
    justify-content: flex-start;
}
.hero-title {
    font-size: 3.2rem;
    line-height: 1.5;
    color: #4A3C3F; 
    margin: 0 0 30px 0;
    white-space: nowrap;
}
.hero-text-wrap p {
    color: #827175; 
}
.fukidashi {
    display: inline-block;
    background: #fff;
    padding: 15px 30px;
    border-radius: 50px 50px 50px 0;
    box-shadow: 0 10px 40px rgba(212,163,179,0.2);
    font-size: 1rem;
    margin-bottom: 25px;
    border-left: 4px solid #C9738C; /* ★華やかなアクセント */
    color: #C9738C; 
    font-weight: 500;
}

/* 正円バッジ */
.circle-badge {
    width: 140px;
    height: 140px;
    background-color: #FDF2F8; /* ★より明るいサクラピンク */
    border-radius: 50%; 
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #C9738C; /* ★グレーからピンクへ変更 */
    box-shadow: 0 10px 25px rgba(212, 163, 179, 0.25);
    transition: 0.3s;
    line-height: 1.3;
}
.circle-badge:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(212, 163, 179, 0.4);
    background-color: #fff;
}
.cb-top {
    font-size: 0.85rem;
    font-weight: 500;
}
.cb-bottom {
    font-size: 1.25rem;
    font-weight: 700;
    margin-top: 2px;
}

/* ★グラデーションで華やかなボタンに */
.hero-btn { 
    display: inline-block; 
    margin-top: 10px; 
    padding: 16px 50px; 
    background: linear-gradient(135deg, #DF9CAE 0%, #C9738C 100%);
    color: #fff; 
    border-radius: 50px; 
    font-size: 1.05rem; 
    letter-spacing: 0.05em; 
    box-shadow: 0 5px 20px rgba(201,115,140,0.3); 
    transition: 0.3s; 
    font-weight: 500;
}
.hero-btn:hover { 
    transform: translateY(-3px); 
    box-shadow: 0 8px 25px rgba(201,115,140,0.5); 
    color: #fff;
    filter: brightness(1.05);
}

.hero-image-box {
    position: absolute;
    top: 0;
    right: 0;
    width: 65%;
    height: 100%;
    z-index: 1;
}
.hero-image-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    mask-image: linear-gradient(to left, black 45%, transparent 85%);
    -webkit-mask-image: linear-gradient(to left, black 45%, transparent 85%);
}

/* =======================================
   5-8. トップページ各セクション
======================================= */
.cases-section { background-color: #FFFAFC; /* ★真っ白やグレーではなく、ごくごく薄いピンク白 */ }
.cases-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; }
.case-card { background: #fff; padding: 40px; border-radius: 20px; box-shadow: 0 10px 30px rgba(212,163,179,0.1); border-top: 5px solid #FDF2F8; position: relative; transition: 0.3s; }
.case-card:hover { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(212,163,179,0.2); border-top: 5px solid #C9738C; }
.case-num { position: absolute; top: 20px; right: 30px; font-size: 3.5rem; color: #FDF2F8; line-height: 1; z-index: 0; }
.case-title { font-size: 1.5rem; color: #4A3C3F; margin-bottom: 15px; position: relative; z-index: 1; }
.case-lead { font-weight: 500; color: #C9738C; margin-bottom: 15px; font-size: 1.05rem; position: relative; z-index: 1; border-bottom: 1px dashed #FDF2F8; padding-bottom: 15px; }
.case-desc, .case-list { color: #827175; font-size: 0.95rem; line-height: 1.8; position: relative; z-index: 1; margin: 0; }
.case-list { padding-left: 1.5em; }

.price-guide { background-color: #fff; text-align: center; }
.price-card-simple { background: #fff; padding: 40px; border-radius: 30px; box-shadow: 0 10px 30px rgba(212,163,179,0.15); border: 1px solid #FDF2F8; max-width: 600px; margin: 0 auto 40px; text-align: left; }
.price-item-simple { display: flex; justify-content: space-between; padding: 20px 0; border-bottom: 1px solid #FDF2F8; color: #827175;}
.price-item-simple:last-child { border-bottom: none; }
.read-more-btn { display: inline-block; padding: 15px 60px; background-color: #fff; color: #C9738C; border-radius: 50px; font-size: 0.9rem; letter-spacing: 0.1em; border: 1px solid #C9738C; transition: 0.3s; }
.read-more-btn:hover { background: linear-gradient(135deg, #DF9CAE 0%, #C9738C 100%); color: #fff; border-color: transparent; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(201,115,140,0.3); }

.enhanced-about { background-color: #FDF2F8; } 
.feature-flex { display: flex; justify-content: space-between; gap: 30px; margin-bottom: 100px; }
.feature-card { 
    flex: 1; 
    min-width: 0; 
    text-align: center; 
    padding: 40px 25px; 
    background: #fff; 
    border-radius: 20px; 
    box-shadow: 0 10px 30px rgba(212,163,179,0.1); 
}
.feature-illustration { 
    height: 100px; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    margin-bottom: 15px; 
    width: 100%; 
    overflow: hidden; 
}
.feature-illustration img { 
    height: 100%; 
    width: auto; 
    max-width: 100%; 
    object-fit: contain; 
}
.feature-num { font-size: 1.8rem; color: #C9738C; margin-bottom: 10px; font-weight: 700; display: block; }
.feature-card h3 { font-size: 1.2rem; margin-bottom: 15px; color: #4A3C3F; }
.feature-card p { font-size: 0.9rem; color: #827175; line-height: 1.7; margin: 0; word-break: break-word; }

/* --------------------------------------
   さくらオフィスについて（おもい部分）
-------------------------------------- */
.omoi-container { 
    background-color: rgba(255,255,255,0.9); 
    padding: 70px 60px; 
    border-radius: 40px; 
    max-width: 950px; 
    margin: 0 auto; 
    text-align: center; 
    position: relative; 
    box-shadow: 0 15px 50px rgba(212,163,179,0.15); 
}
.omoi-title { 
    font-size: 1.8rem; 
    color: #C9738C; 
    margin-bottom: 50px; 
    letter-spacing: 0.1em; 
}
.omoi-flex {
    display: flex;
    align-items: center;
    gap: 60px;
    text-align: left;
}
.omoi-image { 
    flex-shrink: 0;
    width: 260px; 
    height: 260px; 
    border-radius: 50%; 
    border: 8px solid #fff; 
    overflow: hidden; 
    box-shadow: 0 15px 30px rgba(212,163,179,0.3); 
}
.omoi-image img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    object-position: center 20%; 
}
.omoi-content { 
    flex-grow: 1;
}
.omoi-lead { 
    display: inline-block; 
    font-size: 1.45rem; 
    color: #C9738C; 
    margin-bottom: 25px; 
    padding-bottom: 15px;
    border-bottom: 2px solid #FDF2F8; 
    font-weight: 700;
    line-height: 1.4;
}
.omoi-content p { 
    line-height: 2.2; 
    color: #827175; 
    font-size: 0.95rem; 
    margin: 0; 
}
.omoi-signature { 
    text-align: right; 
    margin-top: 30px; 
    font-size: 1.2rem; 
    color: #4A3C3F; 
    font-weight: 700;
}

.faq-section { background-color: #FFFAFC; }
.faq-container { max-width: 800px; margin: 0 auto; }
.faq-item { background: #fff; padding: 30px 40px; border-radius: 20px; box-shadow: 0 5px 20px rgba(212,163,179,0.1); margin-bottom: 20px; border-left: 5px solid #FDF2F8; }
.faq-q { font-size: 1.1rem; color: #4A3C3F; font-weight: 700; margin-bottom: 15px; display: flex; align-items: flex-start; }
.faq-a { font-size: 0.95rem; color: #827175; display: flex; align-items: flex-start; line-height: 1.8; margin: 0; }
.q-mark { color: #C9738C; font-size: 1.4rem; margin-right: 15px; line-height: 1; }
.a-mark { color: #E8D5DA; font-size: 1.4rem; margin-right: 15px; line-height: 1; }

.contact-section { background-color: #fff; padding-bottom: 100px; }
.contact-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; margin-bottom: 60px; max-width: 900px; margin: 0 auto; }
.contact-card { padding: 50px 40px; background-color: #fff; border-radius: 25px; border: 1px solid #FDF2F8; text-align: center; box-shadow: 0 10px 30px rgba(212,163,179,0.1); }
.contact-card h4 { color: #C9738C; font-size: 0.85rem; margin: 0 0 20px 0; letter-spacing: 0.1em; text-transform: uppercase; }
.tel-number { font-size: 1.8rem; color: #4A3C3F; display: block; margin-bottom: 5px; }
.contact-card a { color: #C9738C; text-decoration: underline; }
.contact-card small { color: #827175; }
.map-wrapper { width: 100%; height: 500px; border-radius: 30px; overflow: hidden; border: 1px solid #FDF2F8; margin-top: 20px; box-shadow: 0 10px 30px rgba(212,163,179,0.1); }

/*フッター*/
footer a { color: #999; }

/* =======================================
   9. レスポンシブ対応 (Mobile: 900px以下)
======================================= */
@media (max-width: 900px) {
    section { padding: 60px 0; }
    .section-title { font-size: 1.6rem; margin-bottom: 40px; }
    header { height: 60px; }
    .logo img { height: 35px; }

    .header-tel { 
        border-left: none;
        padding-left: 0;
        margin-right: 15px; 
    }
    .header-tel-label { display: none; }
    .header-tel-number { 
        font-size: 0.95rem; 
        background: #FDF2F8; 
        padding: 6px 12px;
        border-radius: 50px; 
        border: 1px solid #C9738C;
        color: #C9738C;
        display: inline-flex;
        align-items: center;
    }
    .sp-tel-icon { display: inline; margin-right: 4px; font-size: 0.9rem; }

    .menu-toggle { display: block; width: 30px; height: 20px; position: relative; z-index: 1001; cursor: pointer; }
    .menu-toggle span { display: block; width: 100%; height: 2px; background: #4A3C3F; position: absolute; transition: 0.3s; }
    .menu-toggle span:nth-child(1) { top: 0; }
    .menu-toggle span:nth-child(2) { top: 9px; }
    .menu-toggle span:nth-child(3) { bottom: 0; }
    .menu-toggle.active span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
    .menu-toggle.active span:nth-child(2) { opacity: 0; }
    .menu-toggle.active span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

    nav {
        position: fixed; top: 0; right: -100%; width: 80%; height: 100vh;
        background: rgba(255, 255, 255, 0.98); flex-direction: column; justify-content: center;
        z-index: 1000; transition: 0.4s ease-in-out; box-shadow: -5px 0 20px rgba(0,0,0,0.1);
    }
    nav.active { right: 0; }
    nav a { margin: 20px 0; margin-right: 0; font-size: 1.1rem; }

    .hero { 
        height: auto; 
        min-height: auto;
        padding-top: 90px;  
        padding-bottom: 40px; 
        position: relative; 
        display: block;      
    }
    .hero-image-box { 
        position: absolute; 
        top: 0; 
        left: 0; 
        width: 100%; 
        height: 100%; 
        z-index: 1; 
    }
    .hero-image-box img { 
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: right top; 
        mask-image: none !important; 
        -webkit-mask-image: none !important; 
    }
    .hero::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(110deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.85) 45%, rgba(255,255,255,0) 100%);
        z-index: 2; 
    }
    .hero .container {
        position: relative;
        z-index: 3;
    }
    .hero-content { 
        display: flex;
        flex-direction: column;
        padding: 20px 0 0 0; 
    }
    .hero-text-wrap { order: 1; }
    .hero-badges-area {
        order: 2; 
        justify-content: center; 
        gap: 10px;
        margin: 25px 0 10px 0;
        flex-wrap: wrap; 
    }
    .hero-btn-wrap {
        order: 3; 
        width: 100%;
        display: flex;
        justify-content: center; 
    }
    .hero-title { font-size: 1.7rem; line-height: 1.4; white-space: normal; }
    .fukidashi { font-size: 0.85rem; padding: 10px 18px; margin-bottom: 15px; }
    .circle-badge { width: 100px; height: 100px; }
    .cb-top { font-size: 0.7rem; }
    .cb-bottom { font-size: 0.95rem; }
    .hero-btn { 
        display: block; 
        text-align: center; 
        width: 100%;
        max-width: 320px; 
        box-sizing: border-box; 
        padding: 16px 0 !important; 
        margin: 20px 0 0 0 !important; 
    }

    .cases-grid { grid-template-columns: 1fr; gap: 20px; }
    .price-card-simple { padding: 30px 20px; }
    .enhanced-about .feature-flex { flex-direction: column; gap: 20px; margin-bottom: 60px; }
    .feature-illustration { height: 80px; }
    .feature-num { font-size: 1.5rem; }
    .omoi-container { padding: 50px 25px; border-radius: 30px; }
    .omoi-title { font-size: 1.5rem; margin-bottom: 30px; }
    .omoi-flex { flex-direction: column; gap: 30px; text-align: center; }
    .omoi-image { width: 180px; height: 180px; margin: 0 auto; }
    .omoi-content { text-align: left; }
    .omoi-lead { font-size: 1.2rem; display: block; text-align: center; }
    .faq-item { padding: 25px 20px; margin-bottom: 15px; }
    .faq-q { font-size: 1.05rem; }
    .contact-grid { grid-template-columns: 1fr; gap: 20px; }
    .contact-card { padding: 40px 20px; }
    .tel-number { font-size: 1.5rem; }
    .map-wrapper { height: 350px; }
}

/* =======================================
   10. 下層ページ共通 (Sub Pages)
======================================= */
.page-header {
    background-color: #FFFAFC;
    padding: 150px 0 80px;
    text-align: center;
    border-bottom: 1px solid #FDF2F8;
    margin-bottom: 60px;
}
.page-title {
    font-size: 2.4rem;
    color: #4A3C3F;
    margin: 0;
    letter-spacing: 0.1em;
}
.page-tag {
    display: block;
    font-size: 0.85rem;
    color: #C9738C;
    letter-spacing: 0.2em;
    margin-bottom: 10px;
    text-transform: uppercase;
}

/* =======================================
   11. 料金ページ (Price Page)
======================================= */
body.price-page { background-color: #FFFAFC; }
.category-nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 15px; margin-bottom: 60px; }
.category-nav a { padding: 10px 25px; background: #fff; border-radius: 50px; font-size: 0.9rem; color: #827175; box-shadow: 0 4px 15px rgba(212,163,179,0.1); border: 1px solid #FDF2F8; }
.category-nav a:hover { background: #C9738C; color: #fff; border-color: #C9738C; }

.price-category-section { margin-bottom: 80px; }
.category-title { font-size: 1.6rem; color: #4A3C3F; margin-bottom: 25px; padding-left: 15px; border-left: 5px solid #C9738C; }
.table-wrapper { background: #fff; border-radius: 20px; box-shadow: 0 10px 30px rgba(212,163,179,0.1); overflow: hidden; margin-bottom: 20px; }
.price-page table { width: 100%; border-collapse: collapse; }
.price-page th { background-color: #FDF2F8; color: #C9738C; font-weight: 500; padding: 18px 25px; text-align: left; border-bottom: 2px solid #fff; font-size: 0.95rem; }
.price-page td { padding: 18px 25px; border-bottom: 1px solid #FDF2F8; color: #827175; font-size: 0.95rem; vertical-align: top; }
.price-page tr:last-child td { border-bottom: none; }
.price-val { font-size: 1.15rem; color: #4A3C3F; font-weight: 500; white-space: nowrap; }
.price-page td small { display: block; color: #B49A9F; margin-top: 5px; font-size: 0.8rem; line-height: 1.5; }
.notes-box { padding: 0 15px; }
.note-item { font-size: 0.85rem; color: #827175; margin-bottom: 5px; padding-left: 1.2em; text-indent: -1.2em; line-height: 1.6; }

/* =======================================
   12. お問い合わせページ (Contact Page)
======================================= */
.form-wrapper { background: #fff; padding: 60px 80px; border-radius: 30px; box-shadow: 0 10px 30px rgba(212,163,179,0.1); margin-bottom: 100px; border: 1px solid #FDF2F8; }
.form-intro { text-align: center; margin-bottom: 40px; color: #827175; font-size: 0.95rem; }
.form-group { margin-bottom: 30px; }
.form-label { display: block; font-weight: 500; margin-bottom: 10px; color: #4A3C3F; }
.required { background: linear-gradient(135deg, #DF9CAE 0%, #C9738C 100%); color: #fff; font-size: 0.7rem; padding: 3px 8px; border-radius: 10px; margin-left: 10px; vertical-align: middle; }
.optional { background: #E8D5DA; color: #827175; font-size: 0.7rem; padding: 3px 8px; border-radius: 10px; margin-left: 10px; vertical-align: middle; }

input[type="text"], input[type="email"], input[type="tel"], select, textarea {
    width: 100%; padding: 15px 20px; border: 1px solid #FDF2F8; border-radius: 12px;
    font-size: 1rem; font-family: inherit; color: #4A3C3F; box-sizing: border-box;
    background-color: #FFFAFC; transition: 0.3s;
}
input:focus, select:focus, textarea:focus {
    outline: none; border-color: #C9738C; background-color: #fff; box-shadow: 0 0 0 3px rgba(201,115,140,0.15);
}
textarea { resize: vertical; min-height: 200px; }

.submit-btn-wrapper { text-align: center; margin-top: 50px; }
.submit-btn {
    background: linear-gradient(135deg, #DF9CAE 0%, #C9738C 100%); color: #fff; border: none; padding: 18px 80px;
    font-size: 1.1rem; border-radius: 50px; cursor: pointer; letter-spacing: 0.1em;
    font-weight: 500; transition: 0.3s; box-shadow: 0 5px 20px rgba(201,115,140,0.3);
}
.submit-btn:hover { filter: brightness(1.05); transform: translateY(-3px); box-shadow: 0 8px 25px rgba(201,115,140,0.5); }

/* =======================================
   13. プライバシーポリシー (Privacy Page)
======================================= */
.privacy-wrapper { background: #fff; padding: 60px 80px; border-radius: 30px; box-shadow: 0 10px 30px rgba(212,163,179,0.1); margin-bottom: 100px; border: 1px solid #FDF2F8; }
.privacy-intro { margin-bottom: 40px; color: #827175; font-size: 0.95rem; line-height: 2; }
.privacy-section { margin-bottom: 40px; }
.privacy-h3 { font-size: 1.15rem; color: #4A3C3F; margin-bottom: 15px; padding-left: 15px; border-left: 4px solid #C9738C; }
.privacy-text { color: #827175; font-size: 0.95rem; line-height: 1.8; margin: 0; }
.privacy-list { margin: 10px 0 0; padding-left: 1.5em; color: #827175; font-size: 0.95rem; }
.privacy-list li { margin-bottom: 5px; }
.contact-box { margin-top: 30px; padding: 20px; background-color: #FDF2F8; border-radius: 15px; border: 1px solid #FDF2F8; }

/* =======================================
   14. 下層ページ レスポンシブ (Mobile)
======================================= */
@media (max-width: 900px) {
    .page-header { padding: 120px 0 50px; margin-bottom: 40px; }
    .page-title { font-size: 1.8rem; }
    .category-nav { gap: 10px; }
    .category-nav a { padding: 8px 15px; font-size: 0.85rem; }
    .category-title { font-size: 1.3rem; }
    .table-wrapper { padding: 10px; }
    .price-page table, .price-page thead, .price-page tbody, .price-page th, .price-page td, .price-page tr { display: block; }
    .price-page thead tr { display: none; }
    .price-page tr { border-bottom: 2px dashed #FDF2F8; padding: 15px 0; margin-bottom: 5px; }
    .price-page tr:last-child { border-bottom: none; }
    .price-page td { padding: 5px 10px; border-bottom: none; }
    .price-page td::before { content: attr(data-label); display: block; font-size: 0.75rem; color: #C9738C; font-weight: 700; margin-bottom: 2px; }
    .form-wrapper, .privacy-wrapper { padding: 40px 20px; border-radius: 20px; }
    .submit-btn { width: 100%; padding: 18px 0; }
    .privacy-h3 { font-size: 1.1rem; }
}